ホームページ > ウェブフロントエンド > jsチュートリアル > jsによるテーブルの動的操作(関連カラム情報の追加・削除)_javascriptスキル

jsによるテーブルの動的操作(関連カラム情報の追加・削除)_javascriptスキル

WBOY
リリース: 2016-05-16 17:53:22
オリジナル
887 人が閲覧しました

1. テーブル オブジェクトを取得します
var objTable=document.getElementById( "tb_visitor" );
2. 新しい行を追加します
var objTempRow = objTable.rows[0]; // テンプレート行を取得します
var objNewRow = objTable.insertRow( objTable.rows.length );
objNewRow.id = objTable.rows.length-1;
//行の関連情報を追加します 
for ( var i =0 ; i {
var objNewCell = objNewRow.insertCell( i );
objTempRow.cells[i].innerHTML; /
if(objNewCell.innerHTML.indexOf("value=")!=-1){
var si=objNewCell.innerHTML.indexOf("value=")*1 6;
var ei= objNewCell.innerHTML.indexOf(">");
var cellvalue=objNewCell.innerHTML.substring(si,ei);
//新しい列の内容をクリアして使用可能にします
objNewCell.innerHTML =objNewCell.innerHTML.replace(cellvalue,'').replace('disabled','');
}
}
//行クリックイベントを追加
objNewRow.onclick = new Function( "fn_clickrow(this );");
3. 行を削除します
objTable.deleteRow(objrow.index);

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート