18

bodyタグにコードが含まれていない単純なhtmlページがあります。javascriptを介してbodyタグにhtmlを挿入したいと思います。

私のJavaScriptファイルは次のようになります。

var Global={
    UserWall:function(){
          return "a very long html code";
   }
};

    var globalObject=Object.create(Global);
   document.getElementsByTagName("body").item(0).innerHTML=globalObject.UserWall();

ここで、この非常に長いhtmlコードをページの読み込み時にbodyタグに自動的に挿入する必要があります。しかし、それは私がタイトルで述べたエラーを私に与えています。なぜですか？

また、これはajaxベースのWebサイト（ページのリロードなし）を作成する正しい方法です。つまり、サーバー側スクリプトを呼び出してこの非常に長いhtmlコードを更新し、ページの本文に追加した場合です。

4

4 に答える 4

55

DOMが構築される前に、ほぼ確実にコードを実行しています。ハンドラー関数でコードを実行してみてくださいwindow.onload（ただし、以下の注を参照してください）。

window.onload = function() {
    // all of your code goes in here
    // it runs after the DOM is built
}

もう1つの一般的なクロスブラウザソリューションは、ブロックを終了タグ<script>の直前に配置することです。</body>これは、ニーズに応じて、最適なソリューションになる可能性があります。

<html>
  <body>

    <!-- all of your HTML goes here... -->

    <script>
        // code in this final script element can use all of the DOM
    </script>
  </body>
</html>
  • window.onloadすべての画像とサブフレームが読み込まれるまで待機することに注意してください。これは、DOMが構築されてから長い時間がかかる場合があります。document.addEventListener("DOMContentLoaded", function(){...})この問題を回避するために使用することもできますが、これはクロスブラウザーではサポートされていません。ボトムオブボディのトリックはクロスブラウザであり、DOMが完了するとすぐに実行されます。
于 2012-06-22T19:51:22.577 に答える
5

ここに記載されているすべてのソリューションを実行しました。しかし、私がJqueryを使用してこれを作成するまで、それらは機能しませんでした：

私のHTMLページで：

> <div  id="labelid" > </div>

ボタンをクリックすると、これをJSファイルに入れます。

$("#labelid").html("<label>Salam Alaykom</label>");
于 2013-04-12T09:36:20.750 に答える
4

<head>これはhtmlので実行されていますか？<body>その場合は、タグが実際に最初にロードされていることを確認する必要があります。

たとえば、onloadハンドラーを使用する必要があります：http：//javascript.about.com/library/blonload.htm

于 2012-06-22T19:49:04.593 に答える
0

多分これはうまくいくでしょう： document.getElementsByTagName("body")[0].innerHTML

于 2012-06-22T19:48:36.883 に答える