指定表格中的一行。
Specifies a row in a table.
TD 和 TH 元素可以在行中出現(xiàn)。
要更改 TR 元素中的 HTML,請使用表格對象模型。例如,使用 rowIndex 屬性或 rows 集合獲取對特定表格行的引用。你可以使用 insertRow 和 deleteRow 方法添加或刪除行。要獲取對特定單元格的引用,請使用 cellIndex 屬性或 cells 集合。你可以使用 insertCell 和 deleteCell 方法添加或刪除單元格。要更改特定單元格的內(nèi)容,請使用 innerHTML 或 innerText 屬性。
table 對象及其相關(guān)的元素有各自獨(dú)立的表格對象模型,這與常規(guī)對象模型所采用的方法有很大不同。要獲得關(guān)于表格對象模型更多的信息,請參看如何動態(tài)生成表格。
此元素在 Internet Explorer 3.0 及以上版本的 HTML 中可用,在 Internet Explorer 4.0 及以上版本的腳本中可用。
此元素是塊元素。
此元素需要關(guān)閉標(biāo)簽。
The TD and TH elements are valid within a row.
To change the HTML in the TR element, use the table object model. For example, use the rowIndex property or the rows collection to retrieve a reference to a specific table row. You can add or delete rows using the insertRow and deleteRow methods. To retrieve a reference to a specific cell, use the cellIndex property or the cells collection. You can add or delete cells using the insertCell and deleteCell methods. To change the content of a particular cell, use the innerHTML or innerText property.
The table object and its associated elements have a separate table object model, which utilizes different methods than the general object model. For more information on the table object model, see How to Build Tables Dynamically.
This element is available in HTML as of Internet Explorer 3.0 and in script as of Internet Explorer 4.0.
This element is a block element.
This element requires a closing tag.
這個例子使用了 TR 元素和 TABLE, TD 及 TR 元素創(chuàng)建了兩行的表格。
<TABLE>
<TR>
<TD>This is the first row.</TD>
</TR>
<TR>
<TD>This is the second row.</TD>
</TR>
</TABLE>
這個例子使用表格對象模型在用戶單擊按鈕時向表格中動態(tài)添加了兩行和兩個單元格。
<SCRIPT>
function createRows(){
// Insert two rows.
var oRow1=oTable.insertRow(oTable.rows.length);
var oRow2=oTable.insertRow(oTable.rows.length);
// Retrieve the rows collection for the table.
var aRows=oTable.rows;
// Retrieve the cells collection for the first row.
var aCells=oRow1.cells;
// Insert two cells into the first row.
var oCell1_1=aRows(oRow1.rowIndex).insertCell(aCells.length);
var oCell1_2=aRows(oRow1.rowIndex).insertCell(aCells.length);
// Retrieve the cells collection for the second row.
aCells=oRow2.cells;
// Insert two cells into the second row.
var oCell2_1=aRows(oRow2.rowIndex).insertCell(aCells.length);
var oCell2_2=aRows(oRow2.rowIndex).insertCell(aCells.length);
// Add regular HTML values to the 4 new cells.
oCell1_1.innerHTML="<B>Cell 1.1!</B>";
oCell1_2.innerHTML="<B>Cell 1.2!</B>";
oCell2_1.innerHTML="<B>Cell 2.1!</B>";
oCell2_2.innerHTML="<B>Cell 2.2!</B>";
}
</SCRIPT>
<INPUT TYPE="button" VALUE="Create Rows" onclick="createRows()">
<TABLE BORDER=1 ID="oTable">
</TABLE>