显示用户输入的图像数量？ Javascript

我想让用户收到警报并输入一个数字。将出现相应数量的图像。我有这样的代码： “的document.getElementById（ 'burgerImages'）的innerHTML = X;”显示用户输入的图像数量？ Javascript

<!DOCTYPE hmtl> 
<html> 
    <head> 
    <script> 
//creating my function 
    function howMany(){ 
     var numBurgers = parseInt(prompt('How many burgers do you want?', "3")); 
     var x = ""; 

     for(var count = 0; count < numBurgers; count++;){ 
      x += "<img src=\"burger.jpg\" />"; 
     } 

     document.getElementById('burgerImages').innerHTML = x; 
    } 
</script> 
</head> 
<body onload="howMany();"> 
    <div id="burgerImages"></div> 
</body> 
</html>

有人建议我替换 with“document.getElementById（'burgerImages'）。appendChild（x）。” 但这不起作用。任何想法？

来源

2017-04-10 Sebastien Bolh

对于'appendChild'，传递的参数应该是由'document.createElement'创建的实际DOM元素，而不是字符串。 –

基本上，因为appendChild期望参数是一个Node Element不是一个字符串。

您需要创建不同的节点，然后追加这些节点：

var fragmentCollection = document.createDocumentFragment(); 
for (var i = 0; i < numBurgers; i++) {  
    var img = document.createElement("img"); 
    img.setAttribute('src', 'burger.jpg'); 
    fragmentCollection.appendChild(img); 
} 
var burgerContainer = document.getElementById('burgerImages'); 
burgerContainer.appendChild(fragmentCollection);

参考文献：

来源

2017-04-10 00:56:25

显示用户输入的图像数量？ Javascript

回答

相关问题