table insertRow、deleteRow の定義と使用法の概要_JavaScript スキル-jsチュートリアル-php.cn

テーブルの行数: var trCnt = table.rows.length; (table is Id)

各行の列数: for (var i=0; itable.rows [i].cells.length;

JavaScript 操作テーブル:

insertRow()、deleteRow()、insertCell()、deleteCell() メソッド

table.insertRow() は IE では問題ありませんが、Firefox では table.insertRow(-1) に変更する必要があります
同様に、対応する insertCell() も insertCell(-1) に変更する必要があります

insertRow() メソッド

定義と使用法

insertRow() メソッドは、テーブル内の指定された位置に新しい行を挿入するために使用されます。

構文

tableObject.insertRow(index)

戻り値

新しく挿入された行を表す TableRow を返します。

説明

このメソッドは、新しいタグを表す新しい TableRow オブジェクトを作成し、テーブルの指定された位置に挿入します。

新しい行はインデックスの行の前に挿入されます。インデックスがテーブル内の行数と等しい場合、新しい行がテーブルの末尾に追加されます。

テーブルが空の場合、新しい行は新しいセクションに挿入され、それ自体がテーブルに挿入されます。

スロー

パラメーターのインデックスが 0 未満、またはテーブル内の行数以上の場合、このメソッドはコード INDEX_SIZE_ERR で DOMException 例外をスローします。

例

コードをコピーコードは次のとおりです。

 
< html>

関数 insRow() 
document.getElementById('myTable') ) 
} 

< テーブル id="myTable"> 🎜>
セル2

 1< ;/td>

 入力タイプ"button" onclick="insRow()" 
value="新しい行を挿入"> 

 deleteCell() 

定義と使用法

deleteCell() メソッドは、テーブル行のセル ( 要素) を削除するために使用されます。 

構文 

tablerowObject.deleteCell(index) 

説明

パラメータのインデックスは、行内で削除される表のセルの位置です。

このメソッドは、テーブル行の指定された位置にあるテーブル要素を削除します。

スロー

パラメータのインデックスが 0 未満、または行内のテーブル要素の数以上の場合、このメソッドはコード INDEX_SIZE_ERR の DOMException 例外をスローします。

例

コードをコピー

コードは次のとおりです。

< html>

関数 delRow()

document.getElementById('myTable') ) } < /head> < 🎜><行1>セル2<行2> 1< ;/td>

入力タイプ"button" onclick="delRow()"
value="最初の行を削除">

<
insertCell()

定義と使用法

insertCell() メソッドは、HTML テーブルの行の指定された位置に空の要素を挿入するために使用されます。

構文

tablerowObject.insertCell(index)

戻り値

新しく作成され挿入された要素を表す TableCell オブジェクト。

説明

このメソッドは、新しい要素を作成し、指定された位置の行に挿入します。新しいセルは、index で指定された現在の位置にあるセルの前に挿入されます。インデックスが行内のセルの数と等しい場合、新しいセルが行の末尾に追加されます。

このメソッドはデータテーブル要素のみを挿入できることに注意してください。行にヘッダー要素を追加する必要がある場合は、Document.createElement() メソッドと Node.insertBefore() メソッド (または関連メソッド) を使用して要素を作成して挿入する必要があります。

スロー

パラメータのインデックスが 0 未満、または行内のテーブル要素の数以上の場合、このメソッドはコード INDEX_SIZE_ERR の DOMException 例外をスローします。

例

コードをコピーコードは次のとおりです。

 
< html> 
< head> 
< スクリプト type="text/javascript"> 
{ 
var x=document.getElementById('tr2') insertCell(0 ) 
x.innerHTML="John" 
} 


 border=" 1"> 
 <名 tr> 
 < tr2"> 
  < / テーブル> 
 < br /> input type="button" onclick="insCell()" > ; 
< /html> 

 
deleteCell() 

定義と使用法

deleteCell() メソッドは、テーブル行のセルを削除するために使用されます (< ;td>要素)。 

構文 

tablerowObject.deleteCell(index) 

説明 

{ document.getElementById('tr2') ) } < id=" tr1">

>

<
< ;

< 🎜>
プロジェクト内のアプリケーション:

コードをコピー

コードは次のとおりです: