Question

appendchild 中的错误

2014-05-20

3646

javascript arrays

我有以下非常简单的代码：

<html>
<head>
  <script type="text/javascript" >

    function showAlert(){
      alert("I am clicked");
    }

    function one(){
      var a1 = [1,2,3];
      for (var i=0;i<a1.length;i++) {
        var p = document.createElement('p');
        p.innerHTML = a1[i];
        p.onclick = showAlert;
        document.body.appendChild(p);
      }

      console.log("I am called");
    }

    one();   
  </script>
</head>
</html>

我收到以下错误： Uncaught TypeError：无法读取 null 的属性“appendChild” 。有人能告诉我我哪里出错了吗？我正在 Chrome 中测试。

Answer 1

document.body.appendChild 在主体定义之前运行，因此 document.body 仍为 null 。

请将此脚本移至 <body></body> 下方，或使用以下命令延迟其执行：

window.addEventListener("load", function () { /* we're ready */ });

Answer 2

document.body.appendChild(p)

在此行中。几天前我遇到了同样的问题。如果您将脚本放在标签主体之前，就会发生这种情况。

<html>
<head>
<script type="text/javascript" >

    function showAlert(){
                    alert("I am clicked");
                    }


    function one(){
            var a1 = [1,2,3];
                    for (var i=0;i<a1.length;i++) {
                    var p = document.createElement('p');
                    p.innerHTML = a1[i];
                    p.onclick = showAlert;
                    document.body.appendChild(p);
                    }

            console.log("I am called");
            }

            one();


     </script>
 </head>
 </html>

不起作用。如果您将函数调用放在标签之后，它就可以工作。

<html>
 <head>
    <script>

    function showAlert(){
                    alert("I am clicked");
                    }


    function one(){
            var a1 = [1,2,3];
                    for (var i=0;i<a1.length;i++) {
                    var p = document.createElement('p');
                    p.innerHTML = a1[i];
                    p.onclick = showAlert;
                    document.body.appendChild(p);
                    }

            console.log("I am called");
            }

    </script>
 </head>
 <body>

 <body>
<script type="text/javascript" >
            one();
     </script>
 </html>

在您的上下文中，“主体”尚未初始化，因此它为空

Answer 3

您的 HTML 中似乎缺少 body 标签。因此 document.body 为 null

MDiesel

2014-05-20