JavaScript備忘録 getElementById
2013/10/11 Fri.
JavaScriptがちょっと苦手。
'document.getElementById(...)' は Null またはオブジェクトではありません。
というエラーで悩んだ。
多分、今更ながらなことなんだろうけど初めてわかったので備忘録。
'document.getElementById(...)' は Null またはオブジェクトではありません。
というエラーで悩んだ。
多分、今更ながらなことなんだろうけど初めてわかったので備忘録。
以下のスクリプトはalertの表示は出るが、その下でエラーになる。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset=utf-8>
<title>JS Test</title>
<script>
alert("hellow kitty!!");
document.getElementById("disp").innerHTML = "コメント表示";
</script>
</head>
<body>
<div id="disp"></div>
</body>
</html>
以下のスクリプトは意図どおりに動く。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset=utf-8>
<title>JS Test</title>
</head>
<body>
<div id="disp"></div>
<script>
alert("hellow kitty!!");
document.getElementById("disp").innerHTML = "コメント表示";
</script>
</body>
</html>
ブラウザが
document.getElementById("disp").innerHTML = "コメント表示";
の行を解釈した時点で、ID「disp」を理解できているかどうかと言う違い。
当たり前といえば当たり前だな。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset=utf-8>
<title>JS Test</title>
<script>
alert("hellow kitty!!");
document.getElementById("disp").innerHTML = "コメント表示";
</script>
</head>
<body>
<div id="disp"></div>
</body>
</html>
以下のスクリプトは意図どおりに動く。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset=utf-8>
<title>JS Test</title>
</head>
<body>
<div id="disp"></div>
<script>
alert("hellow kitty!!");
document.getElementById("disp").innerHTML = "コメント表示";
</script>
</body>
</html>
ブラウザが
document.getElementById("disp").innerHTML = "コメント表示";
の行を解釈した時点で、ID「disp」を理解できているかどうかと言う違い。
当たり前といえば当たり前だな。
- 関連記事
category: JavaScript
この記事へのコメント
コメントの投稿
コメントは全て管理人が内容を確認してから表示されます（非公開コメント除く）。
内容によっては表示されない場合がありますことご了承願います。
内容によっては表示されない場合がありますことご了承願います。
