Javascript 无法将属性 InnerHTML 设置为 null

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/11163060/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-24 04:43:29  来源:igfitidea点击:

Cannot set property InnerHTML of null

javascripthtml

提问by Mj1992

I've a simple html page with no code in the body tag. I want to insert the html in the body tag through javascript.

我有一个简单的 html 页面,body 标签中没有代码。我想通过javascript在body标签中插入html。

My javascript file looks like this.

我的 javascript 文件看起来像这样。

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

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

Now I want this very long html code to be auto inserted in the body tag on page load. But it is giving me the error I've mentioned in the title.Why?

现在我希望这个很长的 html 代码在页面加载时自动插入到 body 标签中。但它给了我标题中提到的错误。为什么?

and also is this the correct way to create ajax based website(no page reloads) meaning that if I called server side script to update this very long html code and appended it to the body of the page.

这也是创建基于 ajax 的网站(无页面重新加载)的正确方法,这意味着如果我调用服务器端脚本来更新这个很长的 html 代码并将其附加到页面的正文中。

回答by apsillers

You are almost certainly running your code before the DOM is constructed. Try running your code in a window.onloadhandler function (but see note below):

您几乎可以肯定在构建 DOM 之前运行您的代码。尝试在window.onload处理程序函数中运行您的代码(但请参阅下面的注释):

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

Another popular cross-browser solution is to put your <script>block just before the closing </body>tag. This could be the best solution for you, depending on your needs:

另一种流行的跨浏览器解决方案是将<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>
  • Note that window.onloadwill wait until all images and subframes have loaded, which might be a long time after the DOM is built. You could also use document.addEventListener("DOMContentLoaded", function(){...})to avoid this problem, but this is not supported cross-browser. The bottom-of-body trick is both cross-browser and runs as soon as the DOM is complete.
  • 请注意,window.onload将等到所有图像和子帧都加载完毕,这可能是构建 DOM 后的很长时间。您也可以使用document.addEventListener("DOMContentLoaded", function(){...})来避免此问题,但不支持跨浏览器。底部技巧既是跨浏览器的,又是在 DOM 完成后立即运行。

回答by Mohamed

I have done all the solutions mentionned here. but they didn't work until i have made this one using Jquery :

我已经完成了这里提到的所有解决方案。但直到我使用 Jquery 制作了这个,它们才起作用:

in my HTML page :

在我的 HTML 页面中:

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

and when i click on a button, i put this in my JS file :

当我点击一个按钮时,我把它放在我的 JS 文件中:

$("#labelid").html("<label>Salam Alaykom</label>");

回答by TheZ

Is this running in the <head>of the html? If so, you need to make sure the <body>tag has actually loaded first.

这是<head>在 html 中运行的吗?如果是这样,您需要先确保<body>标签已实际加载。

You need to use an onload handler, for example: http://javascript.about.com/library/blonload.htm

您需要使用 onload 处理程序,例如:http: //javascript.about.com/library/blonload.htm

回答by akonsu

maybe this will work: document.getElementsByTagName("body")[0].innerHTML

也许这会奏效: document.getElementsByTagName("body")[0].innerHTML