删除然后添加子节点

Question

I have a table that need to be hidden on page load and then shown after login So i figured out how to remove the table on login but don't have a clue how to return it

<table class="showAfter">
<tr>
<th></th>
</tr>
</table>

function restart(){
  var removeTable = document.querySelector('.showAfter');
   while (removeTable.hasChildNodes()) {
    removeTable.removeChild(removeTable.firstChild);
   }
}

function restore(){
  var addTable = document.querySelector('.showAfter');
  while (!addTable.hasChildNodes()) {
    append?
 }
}

Thanks for the help

Answer 1

Here's a super cheap way to do the same.

<table class="showAfter">
<tr>
<th></th>
</tr>
</table>


var savedTable = "": // establish var on the window scope so both functions can access it.

function restart(){
  var removeTable = document.querySelector('.showAfter');
  savedTable = removeTable.innerHTML;
  removeTable.innerHTML = "";

  // while (removeTable.hasChildNodes()) {
  //  removeTable.removeChild(removeTable.firstChild);
  // }
}

function restore(){
  var addTable = document.querySelector('.showAfter');
  addTable.innerHTML += savedTable;
  savedTable = "";
  // while (!addTable.hasChildNodes()) {
  //  append?
  // }
}