Home » Jquery » javascript – How to create a function that shows and hides all table rows between rows with 'header' class?

javascript – How to create a function that shows and hides all table rows between rows with 'header' class?

Posted by: admin February 22, 2020 Leave a comment

Questions:

I have to make site which generates some random data and has collapsible rows. How can I create a function that shows and hides all table rows between rows with a ‘header’ class?

for (i = 0; i < 15; i++) {
  var table = document.getElementById("Tabela");
  var tr = table.insertRow();
  tr.id = 1 + i;
  tr.className = 'header';
  var cell1 = tr.insertCell(0);
  var cell2 = tr.insertCell(-1);
  var cell3 = tr.insertCell(0);
  cell1.innerHTML = wydawnictwo[i].nazwa;
  cell2.innerHTML = wydawnictwo[i].adres;
  cell3.innerHTML = i + 1;
  var trh = table.insertRow();
  trh.className = 'books'
  var cell4h = trh.insertCell(0);
  var cell5h = trh.insertCell(0);
  var cell6h = trh.insertCell(0);
  var cell7h = trh.insertCell(0);
  cell4h.innerHTML = 'ISBN';
  cell5h.innerHTML = 'Data wydania';
  cell6h.innerHTML = 'Autor';
  cell7h.innerHTML = 'Nazwa książki'
  var num7 = Math.floor(Math.random() * 30);
  for (j = 0; j < num7; j++) {
    var num8 = Math.floor(Math.random() * 30)
    var table1 = document.getElementById("Tabela");
    var trk = table1.insertRow();
    trk.className = 'books'
    var cell4 = trk.insertCell(0);
    var cell5 = trk.insertCell(0);
    var cell6 = trk.insertCell(0);
    var cell7 = trk.insertCell(0);
    cell4.innerHTML = ksiazka[num8].isb;
    cell5.innerHTML = ksiazka[num8].datawydania;
    cell6.innerHTML = ksiazka[num8].autor;
    cell7.innerHTML = ksiazka[num8].nazwaksiazki;
  }
}
How to&Answer: