HTMLTableElement.insertRow()
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
Метод HTMLTableElement.insertRow()
добавляет новую строку в таблицу и возвращает на неё ссылку.
Синтаксис
var row = HTMLTableElement.insertRow(optional index = -1);
HTMLTableElement
— ссылка на HTML table элемент.index
— индекс новой строки-
row
присваивается ссылка на новую строку. Ссылка на HTMLTableRowElement. Если значениеindex
равно -1 или количеству строк, то строка добавляется как последняя. Если значениеindex
превышает количество строк, выбрасывается исключение IndexSizeError. Если аргумент index пропущен, он равен значению по умолчанию — -1. -
Если таблица содержит несколько элементов
tbody
, то, по умолчанию, новая строка будет добавлена в последний элементtbody
. Добавить строку в определённый элементtbody
:var specific_tbody=document.getElementById(tbody_id); var row=specific_tbody.insertRow(index)
Пример
html
<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>
Чтобы быть валидным HTML документом, элемент TR должен содержать хотя бы один TD элемент.
Обратите внимание, что insertRow
добавляет строку непосредственно в таблицу и возвращает ссылку на эту строку. Строку не нужно добавлять отдельно, как в случае с методом document.createElement()
, для создания нового TR элемента.
Спецификации
Specification |
---|
HTML Standard # dom-table-insertrow-dev |
Совместимость с браузерами
BCD tables only load in the browser