この記事では、テーブルを動的に読み込み、削除するためのJavaScriptの具体的なコードを参考までに紹介します。具体的な内容は次のとおりです。 コード: <!DOCTYPE html> <html lang="ja"> <ヘッド> <メタ文字セット="UTF-8"> <meta http-equiv="X-UA-compatible" content="IE=edge"> <meta name="viewport" content="width=デバイス幅、初期スケール=1.0"> <title>ドキュメント</title> <スタイル> テーブル { マージン: 100px 自動; 幅: 500ピクセル; 境界線の折りたたみ: 折りたたみ; } 番目 { 境界線: 1px の灰色 背景色: ライトグレー; 高さ: 30px; } td { テキスト配置: 中央; 境界線: 1px の灰色 } </スタイル> </head> <本文> <テーブル> <頭> <th>名前</th> <th>件名</th> <th>結果</th> <th>オペレーション</th> </thead> <t本文> </tbody> </テーブル> <スクリプト> var tbd = document.querySelector('tbody'); var 情報 = [{ 名前: 'キャシー', 件名: "javascript", スコア: 60 }, { 名前: 「ミラ」 件名: "java", スコア: 100 }, { 名前: 'キキ', 件名:「python」、 スコア: 80 }, { 名前: 'リンダ', 件名: "jquery", スコア: 70 }] var info_list = []; (var i = 0; i < info.length; i++) の場合 { console.log(info[i]['件名']); var str = "<tr><td>" + info[i]['name'] + "</td>" + "<td>" + info[i]['subject'] + "</td>" + "<td>" + info[i]['score'] + "</td>" + "<td><a href = javascript:;>削除</a></td>" + "</tr>"; info_list.push(str); } tbd.innerHTML = info_list.join(''); var deletes = document.querySelectorAll('a'); (var i = 0; i < deletes.length; i++) { 削除[i].onclick = 関数() { 親ノードを削除します。 } } </スクリプト> </本文> </html> 以上がこの記事の全内容です。皆様の勉強のお役に立てれば幸いです。また、123WORDPRESS.COM を応援していただければ幸いです。 以下もご興味があるかもしれません:
|
>>: Windows Server 2008 64ビット MySQL5.6 インストール不要版 設定方法図
ハッシュ結合ハッシュ結合は実行にインデックスを必要とせず、ほとんどの場合、現在のブロックネストループ...
1. vue-cliをインストールする vue.js で vue.js を実行します。 2. プロジ...
目次概要1. バックエンドデータの取得と処理2. インターフェース表示処理概要前回のエッセイ「ステッ...
よく遭遇する問題: 下部の要素を「下部に貼り付ける」効果を CSS でどのように実現するか。この記事...
実際の開発では、MySQL の主キーは重複できず、主キーが自動的にインクリメントされることがあります...
一つの要求一般的に、企業には複数のプロジェクトがあります。SVN サーバーを設定した後は、プロジェク...
目次1. プロトタイプ(明示的なプロトタイプ) 2. __proto__ (暗黙のプロトタイプ) 3...
序文アプリケーションのバグや DBA の誤操作が発生した場合、テーブル全体が更新される可能性がありま...
シナリオ:クロールされたデータは、別のメインテーブルと同じ構造を持つデータテーブルを生成するため、マ...
1. PAM設定ファイルを編集する sudo vim /etc/pam.d/ログイン2行目に以下を...
0. 準備: • iTunesを閉じる• タスクマネージャーでiTunesから始まるサービスを終了し...
この記事では、CentOS 7.4 サーバーに Apache をインストールする方法と、インストール...
目次LinuxでTCPを作成する手順サーバクライアントTCP確立プロセスサンプルコードLinuxでT...
目次1. 実施プロセス2. オブザーバーを表示する3. ウォッチャーを実装する4. コンパイルを実装...
目次1. Dockerを使用する利点2. Dockerをインストールする1) LinuxにDocke...