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

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

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

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

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

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

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

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

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

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

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

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

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

JavaScriptは難しい。

LIGはWebサイト制作を支援しています。ご興味のある方は事業ぺージをぜひご覧ください。