複製写真：
コード：
JSは動的にテーブルData_2.htmlを追加します
コードコピーは次のとおりです。
<！doctype html>
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<Meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
<Title> jsは、InsertrowとInsertCellメソッドを使用してテーブルデータ_2実装を動的に追加します</title>
<script type = "text/javascript">
var mailarr = [
{"title"： "a c＃upblem"、 "name"： "Zhang San"、 "date"： "2014-03-21"}、
{"title"： "a javascriptの問題"、 "name"： "li si"、 "date"： "2014-03-21"}、
{"title"： "a c question"、 "name"： "55"、 "date"： "2014-03-21"}、
{"title"： "a c ++ question"、 "name"： "zhao liu"、 "date"： "2014-03-21"}
];
var tab = null;
window.onload = function（）{
loadtab（）;
//すべてを選択します
document.getElementById（ "sela"）。onclick = function（）{
if（document.getElementById（ "sela"）。checked == true）{
seleall（tab、true）;
} それ以外 {
seleall（tab、false）;
}
};
//選択したすべてを削除します
document.getElementById（ "delsel"）。onclick = function（）{
//すべての入力コントロールを転送します（選択された最後のチェックボックスを除く）
var chks = document.getElementsByTagname（ 'input'）;
for（var i = chks.length-2; i> = 0; i-）{
var chk = chks [i];
if（chk.checked == true）{
//行の削除処理を選択します
var rownow = chk.parentnode.parentnode;
Rownow.ParentNode.RemoveChild（Rownow）;
} それ以外 {
アラート（ "really"）;
}
}
};
};
関数loadtab（）{
tab = document.getElementById（ "tb"）;
// TRのテーブルにMailARRループトラバーサル法を追加する
for（var rowindex = 0; rowindex <mailarr.length; rowindex ++）{
// var tr = tab.insertrow（-1）; // -1は最後の行を指します
var tr = tab.insertrow（tab.rows.length -1）; //最後の2行に挿入し、最後の行をすべて選択した行に保持する必要があります。
var td1 = tr.insertcell（-1）;
td1.innerhtml = "<入力型= 'チェックボックス'/>";
var td2 = tr.insertcell（-1）;
td2.innerhtml = mailarr [rowindex] .title;
var td3 = tr.insertcell（-1）;
td3.innerhtml = mailarr [rowindex] .name;
var td4 = tr.insertcell（-1）;
td4.innerhtml = mailarr [rowindex] .date;
}
}
//すべてのすべてのボタンを有効にするには、テーブルのすべての行を横断する必要があります
function seleall（mailtab、Issel）{
for（var i = 0; i <mailtab.rows.length; i ++）{
var tr = mailtab.rows [i];
tr.cells [0] .childnodes [0] .checked = issel;
}
}
</script>
</head>
<body>
<表ID = "TB" style = "border-collapse：collapse;">
<tr>
<th>シーケンス</th>
<th>タイトル</th>
<th>メーラーを送信</th>
<th>時間を送信</th>
</tr>
<！ - ループの増加 - >
<！ - すべてを選択 - >
<tr>
<td colspan = "4">
<入力id = "sela" type = "checkbox" /> <label for = "sela">すべてを選択< /label>
<a href = "＃" id = "delsel">削除</a> </td>
</tr>
</table>
</body>
</html>