无法读取null的属性'appendChild'

时间:2015-11-07 02:52:52

标签: javascript html dom

这是我的代码,我是java脚本的初学者。

update #model_data set tires = case 
    when vehicles = '1' and age = '1' then 2
    when vehicles = '1' and age = '2' then 3
    when vehicles = '1' and age = '3+' then 4
end

出现问题的部分是函数生成面

<!doctype html>
<html>
    <head>
        <style>
            div {position:absolute; width:500px; height:500px}
            img {position:absolute}
            #rightSide { left: 500px;
            border-left: 1px solid black }
        </style>
        <script>
           function generateFaces() {
               var numberOfFaces = 5;
               var theLeftSide = document.getElementById("leftSide");
               var theRightSide = document.getElementById("rightside");
               for (var i = 1; i <= numberOfFaces; i++) {
                   this_img = document.createElement("img");
                   this_img.src = "http://home.cse.ust.hk/~rossiter/mooc/matching_game/smile.png";
                   var topIndex = Math.floor(Math.random() * 401);
                   var leftIndex = Math.floor(Math.random() * 401);
                   this_img.style.top = topIndex + "px";
                   this_img.style.left = leftIndex + "px";
                   this_img.style.position = "absolute";
                   theLeftSide.appendChild(this_img);
                   theLeftimages = document.cloneNode(true);
                   theLeftimages = theLeftimages.removeChild(theLeftimages.lastChild);
                   theRightSide.appendChild(theLeftimages);
               };
           }
        </script>
    </head>
    <body onload = "generateFaces()">
      <h1>Matching Game</h1>        
      <p>Click on the extra smiling face on the left.</p>
      <div id="leftSide"></div>
      <div id="rightSide"></div>
    </body>
</html> 

当我使用theRightSide.appendChild(theLeftimages)追加孩子时; 它显示错误

  

未捕获的TypeError:无法读取null的属性'appendChild'。

我无法将图像克隆到右侧div。

2 个答案:

答案 0 :(得分:0)

Javascript区分大小写。它应该是正确的

try-for-combo

因为它没有获取元素,所以它返回Null到theRightSide,它显然没有appendChild函数:)

答案 1 :(得分:0)

如果找不到具有给定ID的元素,

document.getElementById(...)将返回null

// You need to change:
var theRightSide = document.getElementById("rightside");
// To:
var theRightSide = document.getElementById("rightSide");
                                              // ^ See capital 'S'