JavaScript createTHead method
In JavaScript we can create and add table header to the
specified table by using the method createTHead() on the table object.
Syntax for using the createTHead() method is as described below :
Syntax:
| TableObject.createTHead(); |
Description of code:
In the following example code we have created a table
with the id "table" and we also have one button "Create
head" which calls the JavaScript function createTableHeader(). In
the function createTableHeader() we have taken the table object by its id
using the method getElementById('table') and with this object we can create
table header.
| document.getElementById('table') .createTHead(); |
We can also add some style and color to this table
header. Here is the full example code for createTHeadExample.html as given
below:
createTHeadExample.html
<html>
<body>
<script language="JavaScript">
function createTableHeader() {
var header =
document.getElementById('table').createTHead();
header.bgColor = '#aaacbc';
}
</script>
<p align="center"> </p>
<div style="background: #cf2255; width:'100%';" align="center">
<font color="#ffffcc" size="12pt">
<b>Creating Table Header</b>
</font>
</div>
<center>
<table id="table" border="1" width="400">
<thead>
<th colspan="2"> Information table Header </th>
</thead>
<tr>
<td>Name</td>
<td>Deepak Kumar</td>
</tr>
<tr>
<td>Designation</td>
<td>IT Manager</td>
</tr>
</table>
</center>
<p>
<center>
<input type="button" value="Create head"
onclick="createTableHeader();
this.disabled='true';">
</center>
</p>
</body>
</html>
|
Output:
Click on "Create head" button.
Download Source Code
|
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
