すまん、>>1 は我ながら嫌味な文体だった。
補足しておくと、DOM Core だけで頑張る場合、HTML の文法、特にデフォルト値・デフォルト内容の有無には注意しなければならない（DOM Core は、生成したデータの妥当性までは検証してくれない）。ちなみに、下記は妥当な HTML なのだが、どこに何の要素が存在しており、どのようにタグが省略されているか、お分かりだろうか。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>TEST</title>
<script type="text/javascript">
if (document.implementation &&
document.implementation.hasFeature ('Core', '1.0'))
onload = function () {
var table = document.createElement ('table');
var tbody = table.appendChild (document.createElement ('tbody'));
for (var i = 0; i < 3; i++) {
var row = tbody.appendChild (document.createElement ('tr'));
for (var j = 0; j < 3; i++) {
var cell = row.appendChild (document.createElement ('td'));
cell.appendChild (document.createTextNode ('TEST'));
}
}
table.childNodes[0].childNodes[1].childNodes[1].style.background = 'blue';
document.body.appendChild (table);
}
</script>
DOM HTML では、表の操作のための特別なインタフェースが用意されている。複雑な表には力不足だが、簡単な表を作るときは便利。特に insertRow() は、tbody 要素が必要な場合に自動的に作成し、その中に tr 要素を生成してくれる。
http://www2u.biglobe.ne.jp/%7Eoz-07ams/prog/dom-ref/HTML/HTMLTableElement.html#HTMLTableElement-insertRow
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>TEST</title>
<script type="text/javascript">
if (document.implementation &&
document.implementation.hasFeature ('HTML', '1.0'))
onload = function () {
var table = document.createElement ('table');
for (var i = 0; i < 3; i++) {
var row = table.insertRow (i);
for (var j = 0; j < 3; i++) {
var cell = row.insertCell (j);
cell.appendChild (document.createTextNode ('TEST'));
}
}
table.rows[1].cells[1].style.background = 'blue';
document.body.appendChild (table);
}
</script>
