Web無料相談会2018冬
Web無料相談会2018冬
2008.03.18

JavaScriptでTABLEを作る時にTHを入れたい

づや

JavaScriptでテーブルをボタンが押されたら動的に1行増やしたかった。

それで書いてみたのが下のコード

function addTable(){
	// tableのオブジェクトを取得
	var tObj = $('table');
	// 行の長さを取得
	var index = tObj.rows["length"];
	// trを1つ追加
	var insObj= tObj.insertRow(index);

        // セルを1つ追加
        var thObj =nsObj.insertCell(0);
        var thObj.innerHTML = "タイトル";

        // セルをもう1つ追加
	var trCell=insObj.insertCell(1);
	var thObj.innerHTML = "中身";
}

これで増えるのだけれど、タイトルを各部分をthタグにしたかったのだが、tdタグになってしまう。

insertCell()はtdタグを追加してくれるだけなのかな。

しょうがないのでこんな感じにした。

function addTable(){
	// tableのオブジェクトを取得
	var tObj = $('table');
	// 行の長さを取得
	var index = tObj.rows["length"];
	// trを1つ追加
	var insObj= tObj.insertRow(index);

        // セルを1つ追加
        // thオブジェクト作成
	var thObj = document.createElement("th");
        thObj.innerHTML = "タイトル";
        // trオブジェクトに追加
        insObj.appendChild(thObj);

        // セルをもう1つ追加
	var trCell=insObj.insertCell(1);
	var thObj.innerHTML = "中身";
}

これでthタグを追加できたけど、もっといいやり方がありそうな気がしてしょうがないなぁ。

JavaScriptは難しい。