- 2008-06-24 (火)
- 技術
onloadやDomContentLoadedを待たずにJavaScript処理をしたい場合は多々あるのですが、例えば以下のようにあるエレメントの下にScriptタグを書いて実行させる場合にinnerHTMLの値が空っぽだとdocument.getElementByIdで取得したときにnullになってしまう現象があった。
<span id="txt"></span>
<script type="text/javascript">
<!--
alert(document.getElementById("txt"));
//-->
</script>
alertはnullと表示される。
<span id="txt">aiueo</span>
<script type="text/javascript">
<!--
alert(document.getElementById("txt"));
//-->
</script>
alertは[object HTMLSpanElement]と表示される。
divタグでやっても一緒だった。
divとかspanはあくまでも枠やラベル的なものでしかないからダメなのかな。
以下のようにbutton要素の場合はinnerHTMLがなくても大丈夫だった。
<button id="txt"></button>
<script type="text/javascript">
<!--
alert(document.getElementById("txt"));
//-->
</script>
また当然のようですが、onloadを待てばちゃんとエレメントのオブジェクトが取得できる。
これが出来ないとinnerHTMLに値を挿入できなくなっちゃうしね。
<script type="text/javascript"> <!--
function f() {
alert(document.getElementById("txt").innerHTML);
}
//-->
</script>
<body onload="f();">
<span id="txt"></span >
</body>
Trackback:0
- TrackBack URL for this entry
- http://hisasann.com/cgi-bin/mt/mt-tb.cgi/1051
- Listed below are links to weblogs that reference
- innerHTMLに値がないとgetElementByIdでnullになるパターン from HouseTect, JavaScriptな情報をあなたに
