HTML | DOM TableData ColSpan Property - GeeksforGeeks

Trang chủ » Html Colspan Javascript » HTML | DOM TableData ColSpan Property - GeeksforGeeks

Có thể bạn quan tâm

The Dom TableData colSpan Property in HTML DOM is used to set or return the value of a colspan attribute. The colspan attribute is used to specify the number of columns a table should span.

Syntax:

  • It returns the colSpan property.
tabledataObject.colSpan
  • It is used to set the colSpan property.
tabledataObject.colSpan = number

Property Values: It contains the numeric value which specifies the number of columns a cell should span.

Return Value: It returns a numeric value that represents the number of columns that a cell should span.

Example-1: This Example returns a colspan Property.

HTML

<!DOCTYPE html> <html> <head> <style> table, th, td { border: 1px solid green; } </style> </head> <body> <h1 style="color:green;"> GeeksForGeeks </h1> <h2> DOM TableData Colspan Property </h2> <table> <tr> <td id="myTd" colspan="3"> Geeks </td> <td>For</td> <td>Geeks</td> </tr> </table> <br> <button onclick="myFunction()"> Click Here! </button> <p id="demo" style="font-size:24px; colorgreen;"> </p> <script> function myFunction() { // return Table data colSpan Property var x = document.getElementById( "myTd").colSpan; document.getElementById("demo").innerHTML = x; } </script> </body> </html>

Output: Before Clicking On Button:

After Clicking On Button:

Example-2: This Example sets the colspan Property.

HTML

<!DOCTYPE html> <html> <head> <style> table, th, td { border: 1px solid green; } </style> </head> <body> <h1 style="color:green;"> GeeksForGeeks </h1> <h2> DOM TableData Colspan Property </h2> <table> <tr> <td id="myTd" colSpan="3"> Geeks </td> <td>For</td> <td>Geeks</td> </tr> </table> <br> <button onclick="myFunction()"> Click Here! </button> <p id="demo" style="font-size:24px; colorgreen;"> </p> <script> function myFunction() { // set Table data colSpan Property var x = document.getElementById("myTd").colSpan = "5"; document.getElementById("demo").innerHTML = "The value of the Colspan " + "attribute was changed to " + x; } </script> </body> </html>

Output: Before Clicking On Button:

After Clicking On Button:

Supported Browsers:

  • Google Chrome
  • Mozilla Firefox
  • Edge
  • Opera
  • Safari
Comment More info Next Article JavaScript RegExp \d Metacharacter

M

ManasChhabra2 Follow Improve Article Tags :
  • HTML
  • Web Technologies
  • HTML-DOM

Từ khóa » Html Colspan Javascript