HTMLTableElement

实例属性

继承自其父级 HTMLElement 的属性。

HTMLTableElement.caption

一个 HTMLTableCaptionElement，表示作为该元素的第一个子元素的 <caption>，如果未找到则为 null。设置时，如果该对象不表示一个 <caption>，则会抛出一个名为 HierarchyRequestError 的 DOMException。如果给定一个正确的对象，它将被插入到树中作为此元素的第一个子元素，并且如果存在任何作为此元素的子元素的第一个 <caption>，则会从树中删除。

HTMLTableElement.tHead

一个 HTMLTableSectionElement，表示作为该元素的第一个子元素的 <thead>，如果未找到则为 null。设置时，如果该对象不表示一个 <thead>，则会抛出一个名为 HierarchyRequestError 的 DOMException。如果给定一个正确的对象，它将被插入到树中，紧邻第一个既不是 <caption> 也不是 <colgroup> 的元素之前，如果不存在这样的元素，则作为最后一个子元素，并且如果存在任何作为此元素的子元素的第一个 <thead>，则会从树中删除。

HTMLTableElement.tFoot

一个 HTMLTableSectionElement，表示作为该元素的第一个子元素的 <tfoot>，如果未找到则为 null。设置时，如果该对象不表示一个 <tfoot>，则会抛出一个名为 HierarchyRequestError 的 DOMException。如果给定一个正确的对象，它将被插入到树中，紧邻第一个既不是 <caption>、也不是 <colgroup>、也不是 <thead> 的元素之前，如果不存在这样的元素，则作为最后一个子元素，并且如果存在任何作为此元素的子元素的第一个 <tfoot>，则会从树中删除。

HTMLTableElement.rows 只读

返回一个活的 HTMLCollection，其中包含该元素的所有行，即所有作为该元素的子元素，或作为其 <thead>、<tbody> 和 <tfoot> 子元素之一的子元素的 <tr> 元素。<thead> 的行成员首先出现，按树顺序排列，<tbody> 的成员最后出现，也按树顺序排列。该 HTMLCollection 是活的，当 HTMLTableElement 改变时会自动更新。

HTMLTableElement.tBodies 只读

返回一个活的 HTMLCollection，其中包含该元素的所有 <tbody> 元素。该 HTMLCollection 是活的，当 HTMLTableElement 改变时会自动更新。

过时属性

HTMLTableElement.align 已过时

一个字符串，包含一个枚举值，反映 align 属性。它指示元素内容相对于周围上下文的对齐方式。可能的值是 "left"、"right" 和 "center"。

HTMLTableElement.bgColor 已过时

一个字符串，包含单元格的背景颜色。它反映了已过时的 bgColor 属性。

HTMLTableElement.border 已过时

一个字符串，包含表格边框的像素宽度。它反映了已过时的 border 属性。

HTMLTableElement.cellPadding 已过时

一个字符串，包含单元格内容和单元格边框之间的水平和垂直空间像素宽度。它反映了已过时的 cellpadding 属性。

HTMLTableElement.cellSpacing 已过时

一个字符串，包含单元格之间水平和垂直分隔的像素宽度。它反映了已过时的 cellspacing 属性。

HTMLTableElement.frame 已过时

一个字符串，包含表格外部边框的类型。它反映了已过时的 frame 属性，可以取以下值之一："void"、"above"、"below"、"hsides"、"vsides"、"lhs"、"rhs"、"box" 或 "border"。

HTMLTableElement.rules 已过时

一个字符串，包含表格内部边框的类型。它反映了已过时的 rules 属性，可以取以下值之一："none"、"groups"、"rows"、"cols" 或 "all"。

HTMLTableElement.summary 已过时

一个字符串，包含表格用途或结构的描述。它反映了已过时的 summary 属性。

HTMLTableElement.width 已过时

一个字符串，包含整个表格所需宽度的像素或百分比长度。它反映了已过时的 width 属性。

实例方法

继承自其父级 HTMLElement 的方法.

HTMLTableElement.createTHead()

返回一个 HTMLTableSectionElement，表示作为该元素的第一个子元素的 <thead>。如果未找到，则会创建一个新的，并将其插入到树中，紧邻第一个既不是 <caption> 也不是 <colgroup> 的元素之前，如果不存在这样的元素，则作为最后一个子元素。

HTMLTableElement.deleteTHead()

移除作为该元素的第一个子元素的 <thead>。

HTMLTableElement.createTFoot()

返回一个 HTMLTableSectionElement，表示作为该元素的第一个子元素的 <tfoot>。如果未找到，则会创建一个新的，并将其作为最后一个子元素插入到树中。

HTMLTableElement.deleteTFoot()

移除作为该元素的第一个子元素的 <tfoot>。

HTMLTableElement.createTBody()

返回一个 HTMLTableSectionElement，表示一个作为该元素子元素的新 <tbody>。它被插入到树中，位于最后一个 <tbody> 元素之后，如果不存在这样的元素，则作为最后一个子元素。

HTMLTableElement.createCaption()

返回一个 HTMLElement，表示作为该元素的第一个子元素的 <caption>。如果未找到，则会创建一个新的，并将其作为 <table> 元素的第一个子元素插入到树中。

HTMLTableElement.deleteCaption()

移除作为该元素的第一个子元素的 <caption>。

HTMLTableElement.insertRow()

返回一个 HTMLTableRowElement，表示表格中的新行。它将其插入到行集合中，紧邻给定 index 位置的 <tr> 元素之前。如有必要，会创建一个 <tbody>。如果 index 为 -1，则新行将附加到集合中。如果 index 小于 -1 或大于集合中的行数，则会抛出一个值为 IndexSizeError 的 DOMException。

HTMLTableElement.deleteRow()

移除与参数中给定 index 对应的行。如果 index 值为 -1，则移除最后一行；如果它小于 -1 或大于集合中的行数，则会抛出一个值为 IndexSizeError 的 DOMException。

示例

使用 DOM 表格接口

HTMLTableElement 接口提供了一些方便的方法来创建和操作表格。两个常用方法是 HTMLTableElement.insertRow 和 HTMLTableRowElement.insertCell。

向现有表格添加行和单元格

<table id="table0">
  <tr>
    <td>Row 0 Cell 0</td>
    <td>Row 0 Cell 1</td>
  </tr>
</table>

const table = document.getElementById("table0");
const row = table.insertRow(-1);

for (let i = 0; i < 2; i++) {
  const cell = row.insertCell(-1);
  const text = `Row ${row.rowIndex} Cell ${i}`;
  cell.appendChild(document.createTextNode(text));
}

规范

浏览器兼容性

另见

• 实现此接口的 HTML 元素：<table>。