未捕获的TypeError:无法读取HTMLElement.demoRespondToClick上未定义的属性“ innerHTML”

时间:2019-06-26 05:21:42

标签: javascript html dom innerhtml

我的游戏正常运行,但是尝试重新启动游戏时出现问题。它在innerHTML中显示错误。

在这种情况下,我创建了两个卡片组,因此比较两个卡片组中的卡片会导致innerHTML错误。以前,我只比较了1个卡组中的卡,并且没有错误。

function demoRespondToClick(e) {
  //First deck
  let demoClickedCard = e.target;
  if (demoClickedCard.classList.contains("democard") &&
    !demoClickedCard.classList.contains("open", "show", "match")) {

    demoClickedCard.classList.add("open", "show");
    demoCheckCards.push(demoClickedCard);
  }

  // Second Deck
  let clickedCard = e.target;
  if (clickedCard.classList.contains("card") &&
    !clickedCard.classList.contains("open", "show", "match") &&
    demoCheckCards.length === 1) {

    clickedCard.classList.add("open", "show");
    checkCards.push(clickedCard);
  }

  // IF THE FIRST CARD(DEMO DECK) YOU SELECT MATCHES THE CARD ON THE SECOND DECK, YOU WIN

  //if (demoCheckCards.length === 1) {
    //demoCardboard.classList.add("stop-event");
//PREVIOUS CODE
   // if (checkCards.length === 1) {
    //  cardboard.classList.add("stop-event");
    //}
if (demoCheckCards.length === 1 && checkCards.length === 1) {
    demoCardboard.classList.add("stop-event");
    cardboard.classList.add("stop-event");

  // COMPARING CARD FROM FIRST AND SECOND DECK AND HERE IS THE ERROR
   if (checkCards[0].innerHTML === demoCheckCards[0].innerHTML)(Error line)  {
      matched();
      //AFTER YOU WIN, YOU ARE ALERTED
      alert("You won the challenge");
    } else {
      // IF CARD DOES NOT MATCH, YOU ARE ALERTED
      alert("You lose the challenge");
    }

  }
}

// IF CARDS MATCH, THEN THIS IS THE FUNCTION
function matched() {
  demoCheckCards[0].classList.add("match");
  checkCards[0].classList.add("match");
  demoMatchedCards.push(demoCheckCards[0]);
  matchedCards.push(checkCards[0]);
  checkCards = [];
  demoCheckCards = [];
  matchedCards = [];
  demoMatchedCards = [];
  cardboard.classList.remove("stop-event");
  demoCardboard.classList.remove("stop-event");
}

//RESTART FUNCTION
const restart = document.querySelector(".restart");
function restartGame() {
  checkCards = [];
  demoCheckCards = [];
  matchedCards = [];
  demoMatchedCards = [];
  cardboard.innerHTML = "";
  demoCardboard.innerHTML = "";

  createCardDeck();
  createDemoCardDeck();
}
restart.addEventListener("click", function(){
  restartGame();
});

我希望输出能正确重启我的游戏,而不会引起innerHTML错误

错误消息: 未捕获的TypeError:无法读取HTMLElement.demoRespondToClick中未定义的属性“ innerHTML”

0 个答案:

没有答案