table要素にある行(tr要素)にセル(td要素)を追加
table要素にある行(tr要素)にセル(td要素)を追加するには、rowElement.insertCell
メソッドを使用します。
生成と追加が同時に行われます。
構文
var cellElement = rowElement.insertCell(index);
引数名 | 型 | 説明 | |
---|---|---|---|
第一引数 必須 |
index | number | 追加する位置のインデックス番号 -1を指定すると最後に追加 |
- ※ 第一引数は省略できず省略するとエラーになるとされていますが、実際のブラウザでは省略でき、省略すると-1と同じ動作で最後に追加されます。
戻り値
追加されたtd要素を返します。
サンプルコード
JavaScript
// table要素を取得
var tableElem = document.getElementById('sample-table');
// tbody要素にtr要素(行)を最後に追加
var trElem = tableElem.tBodies[0].insertRow(-1);
// td要素を最後に追加
var cellElem = trElem.insertCell(-1);
// td要素にテキストを追加
cellElem.appendChild(document.createTextNode('セル'));