javascript_javascript スキルでテーブルを動的にロードし、テーブル行を動的に追加する方法

1. テーブルを動的に読み込みます

1. まずhtmlでテーブルの追加位置のIDを設定します

つまり、bodyタグ内にdivタグを記述しますこの div 内に追加されるテーブルを示す HTML 。以下のように

にテーブルを追加するステートメントを記述します。現在の HTML ファイルを

のように <script> タグ内に記述します。 コード <a style="CURSOR: pointer" data="74836" class="copybut" id="copybut74836" onclick="doCopy('code74836')"><U> をコピーします。 コードは次のとおりです。 </script>

< ;script type="text/javascript" >

document.getElementById("tbl").innerHTML="> ;" //ここに追加されるテーブルは、必要に応じて作成できます




js ファイルを導入した場合は、js ファイル (test.js とする) に次のステートメントを直接記述します

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

document .getElementById("tbl").innerHTML=""

次に、独自の HTML ファイルを導入します

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

2. テーブルの行を動的に追加します
1. HTML で最初にテーブルの行の追加位置の ID を設定します (特に正確ではありません)。私のテストに基づいてこの結論が得られました。他の方法がある場合は、メッセージを残してください、ありがとう)、次のように

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

thead は tbody と組み合わせて使用​​されますが、私が書いているときは使用しなくても問題ありませんでした。




[sS ]*n
2.まず行とセルを作成するには、次のように <.tbody> に行を追加します
[code]
row=document.createElement("tr") //行を作成します

td1 =document.createElement("tr"); //セルを作成します

td1.appendChild(document.createTextNode("content")) //セル

行にコンテンツを追加します。 td1); // 行にセルを追加します

document.getElementById("rows").append(row); // 行を


3. 私の小さな発見 (おそらく他の人はすでに知っているでしょう...)

1.

1. HTML ; に " と書いてテストすると、html テーブル内の行は追加されません。

2. 上記のテストが完了したら、HTML を変更して

content" と記述すると、テストでコンテンツを追加できます。

3. 考察: 上記の 2 つのテストからどのような結論が導き出せるか、まだまとめ方がわかりませんが、innerHTML を通じてどのような種類のタグを追加できるでしょうか。