files/ru/web/api/htmltableelement/insertrow/index.html


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79

---
title: HTMLTableElement.insertRow()
slug: Web/API/HTMLTableElement/insertRow
tags:
  - API
  - HTML DOM
  - HTMLTableElement
  - Method
  - Reference
translation_of: Web/API/HTMLTableElement/insertRow
---
<div>
<div>
<div>{{APIRef("HTML DOM")}}</div>
</div>
</div>

<p>Метод <strong><code>HTMLTableElement.insertRow()</code></strong><code>добавляет новую строку в таблицу и возвращает на неё ссылку.</code></p>

<h2 id="Синтаксис">Синтаксис</h2>

<pre class="syntaxbox">var <em>row</em> = <em>HTMLTableElement</em>.insertRow(<em>optional index = -1</em>);</pre>

<ul>
 <li><a href="/en-US/docs/DOM/HTMLTableElement"><code>HTMLTableElement</code></a> — ссылка на <em>HTML table</em> элемент.</li>
 <li><code>index</code> — индекс новой строки</li>
 <li><code>row</code> присваивается ссылка на новую строку. Ссылка на <a href="/en-US/docs/Web/API/HTMLTableRowElement">HTMLTableRowElement</a>.<br>
  Если значение <code>index</code> равно -1 или количеству строк, то строка добавляется как последняя. Если значение <code>index</code> превышает количество строк, <em>выбрасывается</em> исключение IndexSizeError. Если аргумент index пропущен, он равен значению по умолчанию — -1.</li>
 <li>Если таблица содержит несколько элементов <code>tbody</code>, то, по умолчанию, новая строка будет добавлена в последний элемент <code>tbody</code>. Добавить строку в определённый элемент <code>tbody</code>:<br>
  <code>var <em>specific_tbody</em>=document.getElementById(<em>tbody_id</em>);<br>
  var <em>row</em>=specific_tbody.insertRow(<em>index</em>)</code></li>
</ul>

<h2 id="Пример">Пример</h2>

<pre class="brush:html">&lt;table id="TableA"&gt;
&lt;tr&gt;
&lt;td&gt;Old top row&lt;/td&gt;
&lt;/tr&gt;
&lt;/table&gt;
&lt;script type="text/javascript"&gt;

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');

&lt;/script&gt;</pre>

<p>Чтобы быть валидным HTML документом, элемент TR должен содержать хотя бы один TD элемент.</p>

<p>Обратите внимание, что <code>insertRow</code> добавляет строку непосредственно в таблицу и возвращает ссылку на эту строку. Строку не нужно добавлять отдельно, как в случае с методом<code><a href="/en-US/docs/DOM/document.createElement">document.createElement()</a>,</code> для создания нового TR элемента.</p>

<h2 id="Спецификации">Спецификации</h2>

{{Specifications}}

<h2 id="Поддержка_браузерами">Поддержка браузерами</h2>

<p>{{Compat("api.HTMLTableElement.insertRow")}}</p>

<h2 id="Смотрите_также">Смотрите также</h2>

<ul>
 <li>{{domxref("HTMLTableRowElement.insertCell()")}}</li>
</ul>