Question

我是javascript的初学者，我点击它时试图翻转一张卡片。我在调用函数flipcard时在html中传递cardid。但我得到一个错误说不能设置null的属性src。

var faces = []; //array to store card images
     faces[0] = 'images/king-of-diamonds.png';
     faces[1] = 'images/king-of-hearts.png';
     faces[2] = 'images/queen-of-diamonds.png';
     faces[3] = 'images/queen-of-hearts.png';

var cardsInPlay = [];

var checkForMatch = function() {
    if (cardsInPlay[0] === cardsInPlay[1]) {
          console.log("You found a match!");
        } else {
            console.log("Sorry, try again.");
        }
}

var flipCard = function(cardId) {

    document.getElementById('q').src=faces[cardId]

    checkForMatch();
}






 Html



  <div>
            <img onclick="flipCard(1)" id="image1" src="images/back.png" alt="Queen of Diamonds">
            <img onclick="flipCard(2)" id="image2" src="images/back.png" alt="Queen of Hearts">
            <img id="image3" src="images/back.png" alt="King of Diamonds">
            <img id="image4" src="images/back.png" alt="King of Hearts">
        </div>

Answer 1

在代码中查看id = q？

document.getElementById('q').src=faces[cardId]

你的HTML中没有这样的id，这就是你的src为空的原因

如何在javascript记忆游戏中翻转卡片

1 个答案: