{{APIRef("HTML DOM")}}
The HTMLTableElement
interface provides special properties and methods (beyond the regular {{domxref("HTMLElement")}} object interface it also has available to it by inheritance) for manipulating the layout and presentation of tables in an HTML document.
Properties
Inherits properties from its parent, {{domxref("HTMLElement")}}.
- {{domxref("HTMLTableElement.caption")}}
- Is an {{domxref("HTMLTableCaptionElement")}} representing the first {{HTMLElement("caption")}} that is a child of the element, or
null
if none is found. When set, if the object doesn't represent a<caption>
, a {{domxref("DOMException")}} with theHierarchyRequestError
name is thrown. If a correct object is given, it is inserted in the tree as the first child of this element and the first<caption>
that is a child of this element is removed from the tree, if any. - {{domxref("HTMLTableElement.tHead")}}
- Is an {{domxref("HTMLTableSectionElement")}} representing the first {{HTMLElement("thead")}} that is a child of the element, or
null
if none is found. When set, if the object doesn't represent a<thead>
, a {{domxref("DOMException")}} with theHierarchyRequestError
name is thrown. If a correct object is given, it is inserted in the tree immediately before the first element that is neither a {{HTMLElement("caption")}}, nor a {{HTMLElement("colgroup")}}, or as the last child if there is no such element, and the first<thead>
that is a child of this element is removed from the tree, if any. - {{domxref("HTMLTableElement.tFoot")}}
- Is an {{domxref("HTMLTableSectionElement")}} representing the first {{HTMLElement("tfoot")}} that is a child of the element, or
null
if none is found. When set, if the object doesn't represent a<tfoot>
, a {{domxref("DOMException")}} with theHierarchyRequestError
name is thrown. If a correct object is given, it is inserted in the tree immediately before the first element that is neither a {{HTMLElement("caption")}}, a {{HTMLElement("colgroup")}}, nor a {{HTMLElement("thead")}}, or as the last child if there is no such element, and the first<tfoot>
that is a child of this element is removed from the tree, if any. - {{domxref("HTMLTableElement.rows")}} {{readonlyInline}}
- Returns a live {{domxref("HTMLCollection")}} containing all the rows of the element, that is all {{HTMLElement("tr")}} that are a child of the element, or a child or one of its {{HTMLElement("thead")}}, {{HTMLElement("tbody")}} and {{HTMLElement("tfoot")}} children. The rows members of a
<thead>
appear first, in tree order, and those members of a<tbody>
last, also in tree order. TheHTMLCollection
is live and is automatically updated when theHTMLTableElement
changes. - {{domxref("HTMLTableElement.tBodies")}} {{readonlyInline}}
- Returns a live {{domxref("HTMLCollection")}} containing all the {{HTMLElement("tbody")}} of the element. The
HTMLCollection
is live and is automatically updated when theHTMLTableElement
changes. - {{domxref("HTMLTableElement.sortable")}} {{experimental_inline}}
- Is a {{domxref("Boolean")}} value indicating if the user agent is allowed to provide sorting mechanism for the table, if it supports such a feature. This property reflects the {{htmlattrxref("sortable", "table")}} attribute.
- {{domxref("HTMLTableElement.align")}} {{obsolete_inline}}
- Is a {{domxref("DOMString")}} containing an enumerated value reflecting the {{htmlattrxref("align", "table")}} attribute. It indicates the alignment of the element's contents with respect to the surrounding context. The possible values are
"left"
,"right"
, and"center"
. - {{domxref("HTMLTableElement.bgColor")}} {{obsolete_inline}}
- Is a {{domxref("DOMString")}} containing the background color of the cells. It reflects the obsolete {{htmlattrxref("bgColor", "table")}} attribute.
- {{domxref("HTMLTableElement.border")}} {{obsolete_inline}}
- Is a {{domxref("DOMString")}} containing the width in pixels of the border of the table. It reflects the obsolete {{htmlattrxref("border", "table")}} attribute.
- {{domxref("HTMLTableElement.cellPadding")}} {{obsolete_inline}}
- Is a {{domxref("DOMString")}} containing the width in pixels of the horizontal and vertical sapce between cell content and cell borders. It reflects the obsolete {{htmlattrxref("cellpadding", "table")}} attribute.
- {{domxref("HTMLTableElement.cellSpacing")}} {{obsolete_inline}}
- Is a {{domxref("DOMString")}} containing the width in pixels of the horizontal and vertical separation between cells. It reflects the obsolete {{htmlattrxref("cellspacing", "table")}} attribute.
- {{domxref("HTMLTableElement.frame")}} {{obsolete_inline}}
- Is a {{domxref("DOMString")}} containing the type of the external borders of the table. It reflects the obsolete {{htmlattrxref("frame", "table")}} attribute and can take one of the following values:
"void"
,"above"
,"below"
,"hsides"
,"vsides"
,"lhs"
,"rhs"
,"box"
, or"border"
. - {{domxref("HTMLTableElement.rules")}} {{obsolete_inline}}
- Is a {{domxref("DOMString")}} containing the type of the internal borders of the table. It reflects the obsolete {{htmlattrxref("rules", "table")}} attribute and can take one of the following values:
"none"
,"groups"
,"rows"
,"cols"
, or"all"
. - {{domxref("HTMLTableElement.summary")}} {{obsolete_inline}}
- Is a {{domxref("DOMString")}} containing a description of the purpose or the structure of the table. It reflects the obsolete {{htmlattrxref("summary", "table")}} attribute.
- {{domxref("HTMLTableElement.width")}} {{obsolete_inline}}
- Is a {{domxref("DOMString")}} containing the length in pixels or in percentage of the desired width fo the entire table. It reflects the obsolete {{htmlattrxref("width", "table")}} attribute.
Methods
Inherits methods from its parent, {{domxref("HTMLElement")}}.
- {{domxref("HTMLTableElement.createTHead()")}}
- Returns an {{domxref("HTMLElement")}} representing the first {{HTMLElement("thead")}} that is a child of the element. If none is found, a new one is created and inserted in the tree immediately before the first element that is neither a {{HTMLElement("caption")}}, nor a {{HTMLElement("colgroup")}}, or as the last child if there is no such element.
- {{domxref("HTMLTableElement.deleteTHead()")}}
- Removes the first {{HTMLElement("thead")}} that is a child of the element.
- {{domxref("HTMLTableElement.createTFoot()")}}
- Returns an {{domxref("HTMLElement")}} representing the first {{HTMLElement("tfoot")}} that is a child of the element. If none is found, a new one is created and inserted in the tree immediately before the first element that is neither a {{HTMLElement("caption")}}, a {{HTMLElement("colgroup")}}, nor a {{HTMLElement("thead")}}, or as the last child if there is no such element.
- {{domxref("HTMLTableElement.deleteTFoot()")}}
- Removes the first {{HTMLElement("tfoot")}} that is a child of the element.
- {{domxref("HTMLTableElement.createCaption()")}}
- Returns an {{domxref("HTMLElement")}} representing the first {{HTMLElement("caption")}} that is a child of the element. If none is found, a new one is created and inserted in the tree as the first child of the {{HTMLElement("table")}} element.
- {{domxref("HTMLTableElement.deleteCaption()")}}
- Removes the first {{HTMLElement("caption")}} that is a child of the element.
- {{domxref("HTMLTableElement.insertRow()")}}
- Returns an {{domxref("HTMLTableRowElement")}} representing a new row of the table. It inserts it in the rows collection immediately before the {{HTMLElement("tr")}} element at the given
index
position. If necessary a {{HTMLElement("tbody")}} is created. If theindex
is-1
, the new row is appended to the collection. If theindex
is smaller than-1
or greater than the number of rows in the collection, a {{domxref("DOMException")}} with the valueIndexSizeError
is raised. - {{domxref("HTMLTableElement.deleteRow()")}}
- Removes the row corresponding to the
index
given in parameter. If theindex
value is-1
the last row is removed; if it smaller than-1
or greater than the amount of rows in the collection, a {{domxref("DOMException")}} with the valueIndexSizeError
is raised. - {{domxref("HTMLTableElement.stopSorting()")}} {{experimental_inline}}
- Removes the
sortable
attribute to all {{HTMLElement("th")}} elements of the table.
Specifications
Specification | Status | Comment |
---|---|---|
{{SpecName('HTML WHATWG', "tabular-data.html#the-table-element", "HTMLTableElement")}} | {{Spec2('HTML WHATWG')}} | Added the sortable property and the stopSorting() method. |
{{SpecName('HTML5 W3C', "tabular-data.html#the-table-element", "HTMLTableElement")}} | {{Spec2('HTML5 W3C')}} | Added the createTBody() method.Obsoleted xaz |
{{SpecName('DOM2 HTML', 'html.html#ID-64060425', 'HTMLTableElement')}} | {{Spec2('DOM2 HTML')}} | Defined when caption , tHead , tFoot , insertRow() , and deleteRow() raise exceptions. |
{{SpecName('DOM1', 'level-one-html.html#ID-64060425', 'HTMLTableElement')}} | {{Spec2('DOM1')}} | Initial definition. |
Browser compatibility
{{CompatibilityTable}}
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|
Basic support | {{CompatVersionUnknown}} | {{CompatGeckoDesktop(1.0)}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} |
sortable property and stopSorting() method {{experimental_inline}} |
{{CompatNo}} | {{CompatNo}} | {{CompatNo}} | {{CompatNo}} | {{CompatNo}} |
createTBody() |
{{CompatVersionUnknown}} | {{CompatGeckoDesktop(25.0)}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} |
Feature | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Basic support | {{CompatVersionUnknown}} | {{CompatGeckoMobile(1.0)}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} |
sortable property and stopSorting() method {{experimental_inline}} |
{{CompatNo}} | {{CompatNo}} | {{CompatNo}} | {{CompatNo}} | {{CompatNo}} |
createTBody() |
{{CompatVersionUnknown}} | {{CompatGeckoMobile(25.0)}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} |
See also
- The HTML element implementing this interface: {{HTMLElement("table")}}.