龙盟编程博客 | 无障碍搜索 | 云盘搜索神器
快速搜索
主页 > web编程 > Javascript编程 >

Javascript Cannot call method 'appendChild' of null错误

时间:2012-12-29 08:41来源:未知 作者:admin 点击:
分享到:
调试过程中出现一个奇怪的错误:Uncaught TypeError: Cannot call method \'appendChild\' of null。 看代码 代码如下 html head titleJS Practice/title /head body script src=script.js/script div id = main h1Simple HTML Page/h1
调试过程中出现一个奇怪的错误:Uncaught TypeError: Cannot call method \'appendChild\' of null。

看代码

 代码如下

<html>  
<head> 
    <title>JS Practice</title>   
</head> 
<body> 
    <script src="script.js"></script>  
    <div id = "main"> 
        <h1>Simple HTML Page</h1> 
        <p>This is a very simple HTML page.</p> 
        <p>It's about as basic as they come. It has: </p> 
        <ul> 
            <li>An H1 Tag</li> 
            <li>Two paragraphs</li> 
            <li>An unordered list</li> 
        </ul> 
    </div> 
    <div id="javascript"> 
    </div> 
</body> 
</html> 


只有在谷歌浏览器出现这个错误,其他IE系列,FF,Opera都是正常。

找了一下原因,js的

 代码如下
document.body.appendChild(container);

是在 body 之前运行的,这个时候,document.body 不存在,即为 null ,所以 document.body.appendChild 就会报告上面的错误。

解决方案:

把SCRIPT 代码包含到 <body></body> 里面或者放到body标签后面即可正常运行.

修改后代码

 代码如下

<html>  
<head> 
    <title>JS Practice</title>   
</head> 
<body> 
    <div id = "main"> 
        <h1>Simple HTML Page</h1> 
        <p>This is a very simple HTML page.</p> 
        <p>It's about as basic as they come. It has: </p> 
        <ul> 
            <li>An H1 Tag</li> 
            <li>Two paragraphs</li> 
            <li>An unordered list</li> 
        </ul> 
    </div> 
    <div id="javascript"> 
    </div> 
 
    <!-- Now it will run after the above elements have been created --> 
    <script src="script.js"></script>  
</body> 
</html> 

你在在gg浏览器下尝试一下会不会出现Javascript Cannot call method 'appendChild' of null错误啊,没有了吧。


精彩图集

赞助商链接