HTML | DOM Table deleteTFoot() Method
The Table deleteTFoot() method is used for deleting a <tfoot> element and its content from a table.
It can be only used if a <tfoot> element already exists.
Syntax
tableObject.deleteTFoot()
Below program illustrates the Table deleteTFoot() method :
Example-1: Deleting a <tfoot> element.
<!DOCTYPE html> < html > < head > < title > Table deleteTFoot() Method in HTML </ title > < style > table, td { border: 1px solid green; } h1 { color: green; } h2 { font-family: Impact; } body { text-align: center; } </ style > </ head > < body > < h1 >w3wiki</ h1 > < h2 >Table deleteTFoot() Method</ h2 > < p >To create a footer for the table, double-click the "Add Footer" button.</ p > < p >To delete the footer from the table, double-click the "Delete Footer" button.</ p > < table id = "Courses" align = "center" > < tr > < td >Java</ td > < td >Fork Java</ td > </ tr > < tr > < td >Python</ td > < td >Fork Python</ td > </ tr > < tr > < td >Placements</ td > < td >Sudo Placement</ td > </ tr > </ table > < br > < button ondblclick = "Add_foot()" > Add Footer </ button > < button ondblclick = "Delete_foot()" > Delete Footer </ button > < script > function Add_foot() { var MyTable = document.getElementById("Courses"); var MyFooter = MyTable.createTFoot(); var MyRow = MyFooter.insertRow(0); var MyCell = MyRow.insertCell(0); MyCell.innerHTML = "< b >Available On w3wiki.</ b >"; } function Delete_foot() { // Delete footer. document.getElementById( "Courses").deleteTFoot(); } </ script > </ body > </ html > |
Output:
Before clicking the “Add Footer” button:
After clicking the “Add Footer” button:
After clicking the “Delete Footer” button:
Supported Browsers:
- Apple Safari
- Internet Explorer
- Firefox
- Google Chrome
- Opera