/** *

HTML Table Element Interface

*

table objects expose the HTMLTableElement interface, which provides special properties and methods (beyond the regular element object interface they also have available to them by inheritance) for manipulating the layout and presentation of tables in HTML. *

*

Properties

*
table.captionÊ
caption returns the table caption. *
table.tHeadÊ
tHead returns the table head. *
table.tFootÊ
tFoot returns the table footer. *
table.rowsÊ
rows returns the rows in the table. *
table.tBodiesÊ
tBodies returns the table bodies. *
*
table.alignÊ
align gets/sets the alignment of the table. *
table.bgColor DeprecatedÊ
bgColor gets/sets the background color of the table. *
table.borderÊ
border gets/sets the table border. *
table.cellPaddingÊ
cellPadding gets/sets the cell padding. *
table.cellSpacingÊ
cellSpacing gets/sets the spacing around the table. *
table.frameÊ
frame specifies which sides of the table have borders. *
table.rulesÊ
rules specifies which interior borders are visible. *
table.summaryÊ
summary gets/sets the table summary. *
table.widthÊ
width gets/sets the width of the table. *
*

Methods

*
table.createTHeadÊ
createTHead creates a table header. *
table.deleteTHeadÊ
deleteTHead removes the table header. *
table.createTFootÊ
createTFoot creates a table footer. *
table.deleteTFootÊ
deleteTFoot removes a table footer. *
table.createCaptionÊ
createCaption creates a new caption for the table. *
table.deleteCaptionÊ
deleteCaption removes the table caption. *
table.insertRowÊ
insertRow inserts a new row. *
table.deleteRowÊ
deleteRow removes a row. *
* * * * */ var Table = { // This is just a stub for a builtin native JavaScript object. /** *

Summary

*

align gets/sets the alignment of the table. *

*

Syntax

*
HTMLTableElement.align = alignment;
* var alignment = HTMLTableElement.align;
* 
*

Parameters

* *

Example

*
// Set the alignmnet of a table
* var t = document.getElementById('TableA');
* t.align = 'center';
* 
*

Notes

*

The align attribute is deprecated in HTML4.0. *

*

Specification

*

W3C DOM 2 HTML Specification HTMLTableElement.align. *

* * * * */ align: undefined, /** *

Summary

*

Deprecated

*

bgcolor gets/sets the background color of the table. *

*

Syntax

*
color = table.bgColor
* table.bgColor = color
* 
*

Parameters

* *

Example

*
// Set table background colour to lightblue
* var t = document.getElementById('TableA');
* t.bgColor = 'lightblue';
* 
*

Notes

*

The bgColor attribute is deprecated in HTML 4.01. The CSS:background-color property should be used instead by modifying the element's style object or using a style rule. *

Also available on DOM tbody, row and cell objects. *

*

Specification

*

DOM Level 2 HTML: HTMLTableElement.bgColor *

* * * * */ bgColor: undefined, /** *

Summary

*

border gets/sets the border width. *

*

Syntax

*
HTMLTableElement.border = border;
* var border = HTMLTableElement.border;
* 
* *

Example

*
// Set the width of a table border to 2 pixels
* var t = document.getElementById("TableA");
* t.border="2";
* 
*

Notes

*

This attribute is deprecated in HTML 4.0. *

*

Specification

*

W3C DOM 2 HTML Specification HTMLTableElement.border. *

* * * * */ border: undefined, /** *

Summary

*

caption returns the table caption. *

*

Syntax

*
string = table.caption
* 
*

Example

*
if (table.caption) {
* // do something with the caption
* }
* 
*

Notes

*

This property returns void if no caption element exists for the table. *

*

Specification

*

caption *

Interface HTMLTableCaptionElement *

* * * * */ caption: undefined, /** *

Summary

*

cellPadding gets/sets the padding around the individual cells of the table. *

*

Syntax

*
HTMLTableElement.cellPadding = padding;
* var padding = HTMLTableElement.cellPadding;
* 
* *

Example

*
// Set cell padding to 10 pixels
* var t = document.getElementById("TableA");
* t.cellPadding = "10";
* 
*

Specification

*

W3C DOM 2 HTML Specification HTMLTableElement.cellPadding. *

* * * * */ cellPadding: undefined, /** *

Summary

*

cellSpacing gets/sets the spacing around the individual cells of the table. *

*

Syntax

*
HTMLTableElement.cellSpacing = spacing;
* var spacing = HTMLTableElement.cellSpacing;
* 
* *

Example

*
// Set the cell spacing to 10 pixels
* var t = document.getElementById('TableA');
* t.cellSpacing = "10";
* 
*

Specification

*

W3C DOM 2 HTML Specification HTMLTableElement.cellSpacing. *

* * * * */ cellSpacing: undefined, /** *

Summary

*

createCaption creates a new caption for the table. *

*

Syntax

*
HTMLTableElement = table.createCaption()
* 
*

Example

*
mycap = mytable.createCaption();
* 
*

Notes

*

If a caption element already exists on the table, this method returns that element. *

*

Specification

*

createCaption *

* * * * */ createCaption: function() { // This is just a stub for a builtin native JavaScript object. }, /** *

Summary

*

createTFoot creates a new TFOOT for the table. *

*

Syntax

*
HTMLTableElement = table.createTFoot()
* 
*

Example

*
myfoot = mytable.createTFoot();
* //checking: myfoot == mytable.tFoot
* 
*

Notes

*

If a tfoot element already exists for the table, this method returns that element *

*

Specification

*

createTFoot *

* * * * */ createTFoot: function() { // This is just a stub for a builtin native JavaScript object. }, /** *

Summary

*

createTHead creates a new THEAD for the table. *

*

Syntax

*
HTMLElementObject = table.createTHead()
* 
*

Example

*
myhead = mytable.createTHead();
* //checking: myhead == mytable.tHead
* 
*

Notes

*

If a thead element already exists for the table, this method returns that element. *

*

Specification

*

createTHead *

* * * * */ createTHead: function() { // This is just a stub for a builtin native JavaScript object. }, /** *

Summary

*

deleteCaption removes the caption from the table. *

*

Syntax

*
HTMLTableElement.deleteCaption()
* 
*

Example

*

mytable.deleteCaption(); *

*

Specification

*

deleteCaption *

* * * * */ deleteCaption: function() { // This is just a stub for a builtin native JavaScript object. }, /** *

Summary

*

deleteRow removes a row from the table. *

*

Syntax

*
HTMLTableElement.deleteRow(index)
* 
*

Parameters

* *

Example

*
mytable.deleteRow(1);
* // delete the second row
* 
*

Specification

*

deleteRow *

* * * * */ deleteRow: function(index) { // This is just a stub for a builtin native JavaScript object. }, /** *

Summary

*

deleteTFoot removes a TFOOT from the table. *

*

Syntax

*
HTMLTableElement.deleteTFoot()
* 
*

Example

*
mytable.deleteTFoot();
* 
*

Specification

*

deleteTFoot *

* * * * */ deleteTFoot: function() { // This is just a stub for a builtin native JavaScript object. }, /** *

Summary

*

deleteTHead removes a THEAD from the table. *

*

Syntax

*
HTMLTableElement.deleteTHead()
* 
*

Example

*
mytable.deleteTHead();
* 
*

Specification

*

deleteTHead *

* * * * */ deleteTHead: function() { // This is just a stub for a builtin native JavaScript object. }, /** *

Summary

*

frame specifies which external table borders to render. *

*

Syntax

*
HTMLTableElement.frame = side;
* var side = HTMLTableElement.frame;
* 
*

Parameters

* *
voidÊ
no sides. this is the default. *
aboveÊ
top side *
belowÊ
bottom side *
hsidesÊ
top and bottom only *
vsidesÊ
right and left sides only *
lhsÊ
left-hand side only *
rhsÊ
right-hand side only *
boxÊ
all four sides *
borderÊ
all four sides *
*

Example

*
// Set the frame of TableA to 'border'
* var t = document.getElementById('TableA');
* t.frame  = "border";
* t.border = "2px";
* 
*

Specification

*

W3C DOM 2 HTML Specification HTMLTableElement.frame. *

* * * * */ frame: undefined, /** *

Summary

*

insertRow inserts a new row in the table. *

*

Syntax

*
var row = HTMLTableElement.insertRow(index);
* 
* *

Example

*
* <table id="TableA">
* <tr>
* <td>Old top row</td>
* </tr>
* </table>
* 
* <script type="text/javascript">
* 
* function addRow(tableID)
* {
* 
* // Get a reference to the table
* var tableRef = document.getElementById(tableID);
* 
* // Insert a row in the table at row index 0
* var newRow   = tableRef.insertRow(0);
* 
* // Insert a cell in the row at index 0
* var newCell  = newRow.insertCell(0);
* 
* // Append a text node to the cell
* var newText  = document.createTextNode('New top row')
* newCell.appendChild(newText);
* }
* 
* // Call addRow() with the ID of a table
* addRow('TableA');
* 
* </script>
* 
*

To be valid in an HTML document, a TR must have at least one TD element. *

Note that insertRow inserts the row directly into the table and returns a reference to the new row. The row does not need to be appended separately as would be the case if document.createElement() had been used to create the new TR element. *

*

Specification

*

DOM Level 2 HTML: insertRow *

* * * * */ insertRow: function(index) { // This is just a stub for a builtin native JavaScript object. }, /** *

Summary

*

rows returns a collection of all the rows in the table. *

*

Syntax

*
HTMLCollectionObject = table.rows
* 
*

Example

*
myrows = mytable.rows;
* 
*

Notes

*

The collection returned by the rows property of a table object includes all the rows in THEAD, TFOOT and all TBODY elements of the table. *

The rows property of a table section element (THEAD, TFOOT or TBODY) contains only the rows in that section element. *

*

Specification

*

rows *

HTMLcollection *

* * * * */ rows: undefined, /** *

Summary

*

rules specifies which cell borders to render in the table. *

*

Syntax

*
HTMLTableElement.rules = rules;
* var rules = HTMLTableElement.rules;
* 
*

Parameters

* *
none
no rules *
groups
lines between groups only *
rows
lines between rows *
cols
lines between cols *
all
lines between all cells *
*

Example

*
// Turn on all the internal borders of a table
* var t = document.getElementById("TableID");
* t.rules = "all";
* 
*

Specification

*

W3C DOM 2 HTML Specification HTMLTableElement.rules. *

* * * * */ rules: undefined, /** *

Summary

*

summary gets/sets a table description. *

*

Syntax

*
HTMLTableElement.summary = string;
* var string = HTMLTableElement.summary;
* 
*

Example

*
HTMLTableElement.summary = "Usage statistics";
* 
*

Specification

*

W3C DOM 2 HTML Specification HTMLTableElement.summary *

* * * * */ summary: undefined, /** *

Summary

*

tBodies returns a collection of the table bodies. *

*

Syntax

*
HTMLCollectionObject = table.tBodies
* 
*

Example

*
length(mytable.tBodies);
* 
*

Notes

*

The collection returned includes implicit TBODY elements. e.g. *

*
* <table>
* <tr>
* <td>cell one</td>
* </tr>
* </table>
* 
*

The DOM generated from the above HTML will have a TBODY element even though the tags are not included in the source HTML. *

*

Specification

*

tBodies *

Interface HTMLCollection *

* * * * */ tBodies: undefined, /** *

Summary

*

tFoot returns the table's TFOOT element. *

*

Syntax

*
HTMLTableSectionElementObject = table.tFoot
* 
*

Example

*
if (table.tFoot == my_foot) {
* ...
* }
* 
*

Notes

*

This property returns VOID if no TFOOT element exists. *

*

Specification

*

tfoot *

Interface HTMLTableSectionElement *

* * * * */ tFoot: undefined, /** *

Summary

*

tHead returns the table's THEAD. *

*

Syntax

*
th_el = table.tHead
* 
*

Parameters

* *

Example

*
if (table.tHead == my_head_el) {
* ...
* }
* 
*

Notes

*

This property returns VOID if no THEAD element exists. *

*

Specification

*

thead *

Interface HTMLTableSectionElement *

* * * * */ tHead: undefined, /** *

Summary

*

width specifies the desired width of the table. *

*

Syntax

*
HTMLTableElement.width = width;
* var width = HTMLTableElement.width;
* 
*

Where width is a string representing the width in number of pixels or as a percentage value. *

*

Example

*
mytable.width = "75%";
* 
*

Specification

*

W3C DOM 2 HTML Specification HTMLTableElement.width *

* * * * */ width: undefined, }; /** *

HTML Table Element Interface

*

table objects expose the HTMLTableElement interface, which provides special properties and methods (beyond the regular element object interface they also have available to them by inheritance) for manipulating the layout and presentation of tables in HTML. *

*

Properties

*
table.captionÊ
caption returns the table caption. *
table.tHeadÊ
tHead returns the table head. *
table.tFootÊ
tFoot returns the table footer. *
table.rowsÊ
rows returns the rows in the table. *
table.tBodiesÊ
tBodies returns the table bodies. *
*
table.alignÊ
align gets/sets the alignment of the table. *
table.bgColor DeprecatedÊ
bgColor gets/sets the background color of the table. *
table.borderÊ
border gets/sets the table border. *
table.cellPaddingÊ
cellPadding gets/sets the cell padding. *
table.cellSpacingÊ
cellSpacing gets/sets the spacing around the table. *
table.frameÊ
frame specifies which sides of the table have borders. *
table.rulesÊ
rules specifies which interior borders are visible. *
table.summaryÊ
summary gets/sets the table summary. *
table.widthÊ
width gets/sets the width of the table. *
*

Methods

*
table.createTHeadÊ
createTHead creates a table header. *
table.deleteTHeadÊ
deleteTHead removes the table header. *
table.createTFootÊ
createTFoot creates a table footer. *
table.deleteTFootÊ
deleteTFoot removes a table footer. *
table.createCaptionÊ
createCaption creates a new caption for the table. *
table.deleteCaptionÊ
deleteCaption removes the table caption. *
table.insertRowÊ
insertRow inserts a new row. *
table.deleteRowÊ
deleteRow removes a row. *
* * * * */ var table = new Table();