<!DOCTYPE html>
<
html
>
<
head
>
<
title
>Table deleteTHead() 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
>GeeksforGeeks</
h1
>
<
h2
>Table deleteTHead() Method</
h2
>
<
p
>To create a Header for the table,
double-click the "Add Header" button.</
p
>
<
p
>To delete the Header from the table,
double-click the "Delete Header" 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_Head()"
>
Add Header
</
button
>
<
button
ondblclick
=
"Delete_Head()"
>
Delete Header
</
button
>
<
script
>
function Add_Head() {
var MyTable =
document.getElementById("Courses");
// Creating table.
var MyHeader =
MyTable.createTHead();
var MyRow = MyHeader.insertRow(0);
var MyCell = MyRow.insertCell(0);
MyCell.innerHTML =
"<
strong
>GeeksforGeeks.</
strong
>";
}
function Delete_Head() {
// Delete thead.
document.getElementById(
"Courses").deleteTHead();
}
</
script
>
</
body
>
</
html
>