HTML DOM TableHeader rowSpan Property
Last Updated :
24 Aug, 2022
The HTML DOM TableHeader rowSpan property is used to set or return the value of the rowspan attribute. The rowspan attribute in HTML specifies the number of rows a cell should span.
Syntax:
- It returns the rowspan property.
tableheaderObject.rowSpan
- It is used to set the rowSpan property.
tableheaderObject.rowSpan = number
Property Values: It contains the value i.e number which specifies the number of rows a cell should span.
Return Values: It returns a numeric value that represents the number of rows a cell should span.
Example 1: This example returns a rowspan property.
HTML
<!DOCTYPE html>
< html >
< head >
< style >
table,
th,
td {
border: 1px solid black;
}
</ style >
</ head >
< body >
< h2 >GeeksforGeeks</ h2 >
< b >DOM TableHeader rowSpan property</ b >
< table >
< tr >
< th id = "headerID" rowspan = "3"
abbr = "GeeksforGeeks" >
Username
</ th >
</ tr >
< tr >
< td >geeks</ td >
</ tr >
</ table >
< br >
< button onclick = "myGeeks()" >
Click Here!
</ button >
< p id = "paraID" style = "font-size:25px;color:green" >
</ p >
< script >
function myGeeks() {
var tab = document.getElementById("headerID").rowSpan;
document.getElementById("paraID").innerHTML = tab;
}
</ script >
</ body >
</ html >
|
Output:
Example 2: Below code is used to set the rowSpan property.
HTML
<!DOCTYPE html>
< html >
< head >
< style >
table,
th,
td {
border: 1px solid black;
}
</ style >
</ head >
< body >
< h2 >GeeksforGeeks</ h2 >
< b >DOM TableHeader rowSpan Property</ b >
< table >
< tr >
< th id = "headerID" rowspan = "3"
abbr = "GeeksforGeeks" >
Username
</ th >
</ tr >
< tr >
< td >geeks</ td >
</ tr >
</ table >
< br >
< button onclick = "myGeeks()" >
Click Here!
</ button >
< p id = "paraID" style = "font-size:20px;color:green" >
</ p >
< script >
function myGeeks() {
var tab =
document.getElementById("headerID").rowSpan = "2";
document.getElementById("paraID").innerHTML
= "The value of the rowspan attribute was changed to : " + tab;
}
</ script >
</ body >
</ html >
|
Output:
Supported Browsers:
- Google Chrome
- Internet Explorer
- Opera
- Firefox
- Apple Safari
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...