HTML | DOM Table tHead Property
Last Updated :
20 Nov, 2021
The Table tHead property is used for returning a reference to the <thead> element of a table.
The <thead> element is used for grouping the header content in an HTML table.
It returns NULL if the <thead> element is not defined.
Syntax
tableObject.tHead
Return Value : A reference to the <thead> element of the table, or null if it is not defined
Below program illustrates the Table THead() property :
Example: Alerting the innerHTML of <thead> element.
html
<!DOCTYPE html>
< html >
< head >
< title >Table tHead Property 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 tHead Property</ h2 >
< p >To return the innerHTML of the thead
element for the table, double-click the
"Return Header" button.</ p >
< table id = "Courses" align = "center" >
< thead >
< tr >
< th >Subject</ th >
< th >Courses</ th >
</ tr >
</ thead >
< 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 = "thead()" >
Return Header
</ button >
< script >
function thead() {
// returning reference of tHead
// using alert.
alert(document.getElementById(
"Courses").tHead.innerHTML);
}
</ script >
</ body >
</ html >
|
Output:
Before clicking the button:
After clicking the button:
Supported Browsers:
- Apple Safari
- Internet Explorer
- Firefox
- Google Chrome
- Opera
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...