Delete entire table rendered from different pages using Javascript

I have a table like:

 <table id="toc" class="toc" border="1" summary="Contents">
 </table>

      

on many pages. All these pages are displayed on one page. when i apply Javascript to remove this usage on load. Only one table is dropped, not the rest.

I am trying to drop tables in all render pages using Javascript. How to do it?

Edit:
I found the solution myself

 <script type='text/javascript'>
    window.onLoad = load(); 
  function load(){var tbl = document.getElementById('toc'); 
   if(tbl) tbl.parentNode.removeChild(tbl);} 
 </script> 

      

+2


a source to share


4 answers


Are you sure you want to delete the table altogether?

var elem = documenet.getElementById('toc');

if (typeof elem != 'undefined')
{
  elem.parentNode.removeChild(elem);
}

      

You can also hide the table instead of deleting it.



var elem = documenet.getElementById('toc');
elem.style.display = 'none';

      

If you need it later, you can simply do:

var elem = documenet.getElementById('toc');
elem.style.display = 'block';

      

+3


a source


Here's a rough sample



<html>
<head>
<script type="text/javascript">

    function removeTable(id)
    {
        var tbl = document.getElementById(id);
        if(tbl) tbl.parentNode.removeChild(tbl);
    }

</script>
</head>
<body>

<table id="toc" class="toc" border="1" summary="Contents">
    <tr><td>This table is going</td></tr>
</table>

<input type="button" onclick="removeTable('toc');" value="Remove!" />

</body>
</html>

      

+3


a source


<script type="text/javascript">
  function deleteTable(){
    document.getElementById('div_table').innerHTML="TABLE DELETED"
  }
</script>

<div id="div_table">

 <table id="toc" class="toc" border="1" summary="Contents">
 </table>
</div>
<input type="button" onClick="deleteTable()">

      

0


a source


var tbl = document.getElementById(id);
tbl.remove();

      

0


a source







All Articles