cells property

Retrieves a collection of all cells in the table row or in the entire table.

Document Object Model (DOM) Level 2 HTML Specification, Section 1.6.5

 

Syntax

JavaScript

p = object.cells

 

Property values

Type: IHTMLElementCollection

Array of td and th elements contained by the object. If the object is a tr, the array contains elements only in that table row. If the object is a table, the array contains all elements in the table.

Standards information

Remarks

A cells collection is comprised of th and td objects.

When a cell spans multiple rows, that cell appears only in the cells collection for the first of the rows that the cell spans.

If duplicate identifiers are found, a collection of those items is returned. Collections of duplicates must be referenced subsequently by ordinal position.

Individual cells or an array of cells can be specified using a spreadsheet format. By specifying a colon-delimited string of the starting and ending cells, a cells collection can be retrieved from anywhere in the table. Specifying a particular cell with this format returns that object. The format of this string uses letters to indicate columns, starting with A, and numbers to indicate rows, starting with 1. A cells collection on a table row includes only the elements within that row if the vIndex string specifies a range of multiple rows using the spreadsheet format.

Examples

This example shows how to use the rows collection on the table object and the cells collection to insert a number into each cell of the table.

Code example: http://samples.msdn.microsoft.com/workshop/samples/author/dhtml/refs/rows-cells.htm

JavaScript
Copy 

<!doctype html>
<html>
  <head>
    <title>Cells example</title>
<script type="text/javascript">
  function numberCells() {
    var count = 1;
    var oTable = document.getElementById('oTable');
    var RowsLength = oTable.rows.length;
    for (var i = 0; i < RowsLength; i++) {
      var oCells = oTable.rows.item(i).cells;
      var CellsLength = oCells.length;
      for (var j = 0; j < CellsLength; j++) {
        oCells.item(j).innerHTML = count++;
      }
    }
  }
</script>
</head>
<body onload="numberCells()">
<table id=oTable border=1>
<tr><th>&nbsp;</th><th>&nbsp;</th><th>&nbsp;</th><th>&nbsp;</th></tr>
<tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>
<tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>
</table>
</body>
</html>

 

 

Show: