Javascript DOM HTML TableHeader cellIndex Property get

Introduction

Click on different cells to get their index position:

View in separate window 

<!DOCTYPE html>
<html>
<head>
<style>
table, th {
  border: 1px solid black;
}
</style>//from   ww  w .  j  a  va  2s. c  om
</head>
<body>
<p id="demo"></p>

<table>
  <tr>
    <th onclick="myFunction(this)">Click to show cellIndex</th>
    <th onclick="myFunction(this)">Click to show cellIndex</th>
    <th onclick="myFunction(this)">Click to show cellIndex</th>
    <th onclick="myFunction(this)">Click to show cellIndex</th>
  </tr>
</table>

<script>
function myFunction(x) {
  document.getElementById("demo").innerHTML = "Cell index is: " + x.cellIndex;
}
</script>

</body>
</html>

The cellIndex property returns the position of a cell in the cells collection of a table row.

The cellIndex property returns a Number representing the position of the cell in the cells collection of a table row.




PreviousNext

Related