的createElement IMG與JavaScript

-2

它不顯示在瀏覽器上的任何圖像，我不知道它在創建圖像錯在何處？標識由一個變量imgFace在哪裏存儲圖像，併爲它的正確屬性，但它似乎沒有顯示任何東西。的createElement IMG與JavaScript

<!DOCTYPE html> 
<html> 
<head> 
    <title>Matching Game</title> 
    <style> 
     img {position:absolute;} 
     div {position:absolute; width:500px; height:500px;} 
     #RightSide { left: 500px; 
      border-left: 1px solid black } 

    </style> 
    <script> 
     var numberOfFaces = 5; 
     var theLeftSide = document.getElementById("LeftSide"); 

     function generateFaces() { 
      var count = 0; 
      while(count <= numberOfFaces){ 
       var imgFace = document.createElement("img"); 
       img.src="http://home.cse.ust.hk/~rossiter/mooc/matching_game/smile.png"; 
       var random_nr = Math.random() * 400; 
       random_nr = Math.floor(random_nr); 
       imgFace.style.top = random_nr + "px"; 
       imgFace.style.left = random_nr + "px"; 
       theLeftSide.appendChild(imgFace); 
       count++; 

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

來源

2015-10-09 Kevin Deconinck

imgFace <=> IMG？ – Sebastian

正如塞巴斯蒂安建議的：'img.src =「http://home.cse.ust.hk/~rossiter/mooc/matching_game/smile.png」;'應該是'imgFace.src =「http：// home。 cse.ust.hk/~rossiter/mooc/matching_game/smile.png「;' –

仍然沒有工作壽。 –

function generateFaces() { 
     var count = 0; 
     while(count <= numberOfFaces){ 
      var imgFace = document.createElement("img"); 
      imgFace.src="http://home.cse.ust.hk/~rossiter/mooc/matching_game/smile.png"; 
      var random_nr = Math.random() * 400; 
      random_nr = Math.floor(random_nr); 
      imgFace.style.top = random_nr + "px"; 
      imgFace.style.left = random_nr + "px"; 
      theLeftSide.appendChild(imgFace); 
      count++; 

     } 
    }

來源

2015-10-09 07:07:03

替換該行

img.src="http://home.cse.ust.hk/~rossiter/mooc/matching_game/smile.png";

與

imgFace.src="http://home.cse.ust.hk/~rossiter/mooc/matching_game/smile.png";

注：img是不是你已經確定了正確的變量名。它應該是imgFace。

來源

2015-10-09 07:08:24 deepakb

兩件事情，

1）你有img.src這應該是imgFace.src。

2）你沒有打電話給你的generateFaces功能。

Working fiddle

來源

2015-10-09 07:09:14 AdityaParab

'onload：'>'調用'generateFaces''。 – deepakb

它被編輯之後，我猜。 – AdityaParab

的createElement IMG與JavaScript

回答

相關問題