てくてくテック☆

「Excel方眼紙使い」から「スマイルエンジニア」にジョブチェンジ。千里の道も一歩から。テック(Tech)の道をてくてく歩く。2017 年の目標は「毎日アウトプット!」。

document.write と innerHTML

innerHTML だとうまくいくのに、
document.write だとうまくいかない。。

やりたいのは、setTimeout 関数でのカウントダウン表示。

↓これだとちゃんとカウントダウンできる

var count = 10;

function countDown () {
    document.getElementById("count1").innerHTML = count;
    --count;
    window.setTimeout("countDown()", 1000);
}

※ div タグの記載など細かい部分は省略

↓これだとうまくいかない(なぜか 9 で止まる。。)

var count = 10;

function countDown () {
    document.write(count);
    --count;
    window.setTimeout("countDown()", 1000);
}

なんでだー??

2013/04/01 追記

早くも解決したかも!

Google 先生で調べてたら、こんなの見つけました。

document.write … 書き出し専用
innerHTML    … 書き換え専用

↓元ネタはこちら
innerhtmlとdocumentwriteどっちつかう? - JavaScript - 教えて!goo


document.write はページの初回表示時の1回こっきりで、
innerHTML はページ表示後も部分的に何度も、といった印象。

カウントダウン表示したい場合は
一度表示した数字を違うものに「書き換え」る必要があったから、
innerHTML だとうまくいったんだなぁ。

なるほどー!