Javascript 如何在循环中创建一个元素并将其（一个接一个地添加5次）附加到特定的div？_Javascript_Getelementbyid_Appendchild_Setattribute

Javascript 如何在循环中创建一个元素并将其（一个接一个地添加5次）附加到特定的div？

javascript

Javascript 如何在循环中创建一个元素并将其（一个接一个地添加5次）附加到特定的div？,javascript,getelementbyid,appendchild,setattribute,Javascript,Getelementbyid,Appendchild,Setattribute,我m试图创建一个元素（image），然后设置一个循环，在一个div中生成5个图像（其id=“leftSide”）。这里s我的代码： <script> var number_of_faces = 0; var theLeftSide = document.getElementById("leftSide"); function generate_faces() { for (number_of_faces = 0; number_of_

我

m试图创建一个元素（image），然后设置一个循环，在一个div中生成5个图像（其id=“leftSide”）。这里

s我的代码：

<script>    
    var number_of_faces = 0;
    var theLeftSide = document.getElementById("leftSide");

    function generate_faces() {
        for (number_of_faces = 0; number_of_faces < 6; number_of_faces++) {
            newFace = document.createElement("img");
            newFace.setAttribute(
              "src",
              "http://home.cse.ust.hk/~rossiter/mooc/matching_game/smile.png"
            );
            document.getElementById("leftSide").appendChild("img");
        }   
   }


</script>


变量数_的_面=0；
var theLeftSide=document.getElementById（“leftSide”）；
函数generate_faces（）{
对于（面数=0；面数<6；面数++）{
newFace=document.createElement（“img”）；
newFace.setAttribute(
“src”，
"http://home.cse.ust.hk/~rossiter/mooc/matching_game/smile.png“
);
document.getElementById（“左侧”）.appendChild（“img”）；
}   
}

Body onload必须调用该函数，但什么也没有发生。Div保持为“空”

更改

document.getElementById（“leftSide”）.appendChild（“img”）与document.getElementById（“leftSide”）.appendChild（newFace）
更改document.getElementById（“leftSide”）.appendChild（“img”）与document.getElementById（“leftSide”）.appendChild（newFace）
您传递了一个字符串“img”，而不是newFace元素。

使用document.getElementById（“leftSide”）.appendChild（newFace）

循环应该是<5
循环5次
 您传递了一个字符串“img”，而不是newFace元素。

使用document.getElementById（“leftSide”）.appendChild（newFace）

循环应该是<5
循环5次
 试试这段代码
<!DOCTYPE html>
<html>
<head>
    <title>Blah</title>
</head>
<body>
<div id="leftSide">

</div>
<script>    
    var number_of_faces = 0;
    var theLeftSide = document.getElementById("leftSide");

    function generate_faces() {
        for (number_of_faces = 0; number_of_faces < 5; number_of_faces++) {
            newFace = document.createElement("img");
            newFace.setAttribute(
              "src",
              "http://home.cse.ust.hk/~rossiter/mooc/matching_game/smile.png"
            );
            theLeftSide.appendChild(newFace);
        }   
   }
   generate_faces();


</script>
</body>
</html>


废话
变量数_的_面=0；
var theLeftSide=document.getElementById（“leftSide”）；
函数generate_faces（）{
对于（面数=0；面数<5；面数++）{
newFace=document.createElement（“img”）；
newFace.setAttribute(
“src”，
"http://home.cse.ust.hk/~rossiter/mooc/matching_game/smile.png“
);
左侧。追加子对象（新面）；
}   
}
生成_面（）；
试试这段代码
<!DOCTYPE html>
<html>
<head>
    <title>Blah</title>
</head>
<body>
<div id="leftSide">

</div>
<script>    
    var number_of_faces = 0;
    var theLeftSide = document.getElementById("leftSide");

    function generate_faces() {
        for (number_of_faces = 0; number_of_faces < 5; number_of_faces++) {
            newFace = document.createElement("img");
            newFace.setAttribute(
              "src",
              "http://home.cse.ust.hk/~rossiter/mooc/matching_game/smile.png"
            );
            theLeftSide.appendChild(newFace);
        }   
   }
   generate_faces();


</script>
</body>
</html>


废话
变量数_的_面=0；
var theLeftSide=document.getElementById（“leftSide”）；
函数generate_faces（）{
对于（面数=0；面数<5；面数++）{
newFace=document.createElement（“img”）；
newFace.setAttribute(
“src”，
"http://home.cse.ust.hk/~rossiter/mooc/matching_game/smile.png“
);
左侧。追加子对象（新面）；
}   
}
生成_面（）；
非常感谢！还有一个问题：闭合循环和函数大括号之间的空白（没有任何代码）：document.getElementById（“leftSide”）.appendChild（“img”）；}影响函数返回将是未定义的？或者更好的是更多leftside.appendChild（newFace）否则，在声明中保留这行代码没有意义。不，在这种情况下，空格或空白不会影响代码。非常感谢！还有一个问题：闭合循环和函数大括号之间的空白（没有任何代码）：document.getElementById（“leftSide”）.appendChild（“img”）；}影响函数返回将是未定义的？或者更好的是更多leftside.appendChild（newFace）否则，在声明中保留这行代码没有意义。不，在这种情况下，空格或空白不会影响代码。您使用它做什么：var theLeftSide=document.getElementById（“leftSide”）如果不使用它，为什么要保留它？你用它做什么：var theLeftSide=document.getElementById（“leftSide”）如果不使用它，为什么要保留它？