- ベストアンサー
innerHTMLが動作しない。
JavaScriptをHTMLファイルに記述した場合、最初にfunctionスコープ内の動作以外は全て行なわれますよね。例えば、 <script type="text/javascript"> <!-- alert("test"); //--> </script> と書いた場合、ページの表示と同時にアラートが出ます。しかし上のalertの部分をdocument.getElementById("test").innerHTML = "test";にすると、これが実行されないのです。もちろん<div id="test"></div>タグはちゃんとbodyタグ内に記述してあります。functionを定義してbody onLoadで呼び出す方法もありますが、できればfunctionをむやみに使いたくないので、先のalertの時のように動作させたいのです。 これが動作しない原因は何なのでしょうか?
- みんなの回答 (3)
- 専門家の回答
質問者が選んだベストアンサー
>できればfunctionをむやみに使いたくない ってどんな主張かしりませんが、つまらないポリシーのために 本来やるべきことを避けているのでは本末転倒ですね。 functionをつかわないなら、bodyの一番最後に scriptをかくことになりますのでひじょーにかっちょわるいです。 前出の回答のほかではよくつかうのはonloadで呼び出す。 <html> <head> <script> window.onload=function(){ document.getElementById("test").innerHTML = "test"; } </script> </head> <body> <div id="test"></div> </body> </html>
その他の回答 (2)
No1でも書かれてるけどJavascriptは上から順に読み込まれる HTMLも上から描画されていく なので読み込んでいってまだ描画されてない所に実行文が有っても無いと言われる。 例 ・headタグ内でscript実行 ・目的のタグがbody内 →まだbodyは読まれてないので無いと言われる 例 //---------- TEST(); function TEST(){ alert("TEST"); } //---------- TESTの実体が出てきてないのに呼び出してるので実行できない
単純にdocument.getElementById("test")がまだ無いだけだと思います。 例えば <head> <script> document.getElementById("test").innerHTML = "test"; </script> </head> ではオブジェクトがありませんとなりますが、 <div id="test"></div> <script> document.getElementById("test").innerHTML = "test"; </script> とすると動くと思います。