ホームページ >ウェブフロントエンド >jsチュートリアル >table insertRow、deleteRow の定義と使用法の概要_JavaScript スキル

table insertRow、deleteRow の定義と使用法の概要_JavaScript スキル

WBOY
WBOYオリジナル
2016-05-16 16:48:241899ブラウズ

テーブルの行数: 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)

説明

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

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

スロー

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






コードをコピー


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


< html>
< head>
< 関数 delCell()
{ document.getElementById('tr2') ) } < id=" tr1">

>

<
< ;

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




コードをコピー


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


声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。