如何在循環中創建一個元素並將其追加（5次一個）到特定的div？

我m trying to create an element(image) and then set a loop that would produce 5 images in one div(its id="leftSide"). Here我的代碼：如何在循環中創建一個元素並將其追加（5次一個）到特定的div？

<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>

身體的onload必須調用功能，但沒有任何反應。 DIV仍然是「空」

來源

2016-06-10 Daria Ivanova

試試這個代碼

<!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>

來源

2016-06-10 04:32:46 Vikram

你在做什麼：var theLeftSide = document.getElementById（「leftSide」）;'你爲什麼要保留它，如果你不使用它？ –

變化document.getElementById("leftSide").appendChild("img");與document.getElementById("leftSide").appendChild(newFace);

來源

2016-06-10 04:29:56 monterico

非常感謝！還有一個問題：關閉循環和函數大括號之間的空格（沒有任何代碼）： document.getElementById（「leftSide」）。appendChild（「img」）; }} 影響函數返回將會是未定義的？ –

或更好 - 更多'theLeftSide.appendChild（newFace）;'否則沒有意義在代碼中保留這行代碼。 –

不，空格或空格在這種情況下不影響代碼 – monterico

你傳遞一個字符串「IMG」，而不是的Newface元素。
使用document.getElementById("leftSide").appendChild(newFace);
和循環應該是< 5循環5次。

來源

2016-06-10 04:30:14 warkentien2

如何在循環中創建一個元素並將其追加（5次一個）到特定的div？

回答

相關問題