Моя игра работает, но при попытке перезапустить игру возникает проблема. Это показывает ошибку в innerHTML.
В этом случае я создал две колоды, поэтому сравнение карт из двух колод приводит к ошибке в innerHTML. Ранее я сравнивал карты только из одной колоды, и она работала без ошибок.
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
СООБЩЕНИЕ ОБ ОШИБКЕ:
Uncaught TypeError: Невозможно прочитать свойство 'innerHTML' из неопределенного в HTMLElement.demoRespondToClick