我的记忆游戏出现问题。 我发布了html和js文件。 在js文件中，以下代码行：
ListofOpenCards [0] .target.className.removeClass（“ open show”）; ListofOpenCards [1] .target.className.removeClass（“ open show”）;
应删除类“ open show”的引发错误。我一直在努力，但找不到解决方案。这是为什么 ？谢谢
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Matching Game</title>
<meta name="description" content="">
<link rel="stylesheet prefetch" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css">
<link rel="stylesheet prefetch" href="https://fonts.googleapis.com/css?family=Coda">
<link rel="stylesheet" href="styles/app.css">
<link rel="shortcut icon" href="">
<script>
var cardList1 = ["fa-diamond","fa-diamond","fa-paper-plane-o","fa-paper-plane-o","fa-anchor","fa-anchor","fa-bolt",
"fa-bolt","fa-cube","fa-cube","fa-leaf","fa-leaf","fa-bicycle","fa-bicycle","fa-bomb","fa-bomb"];
</script>
</head>
<body>
<div class="container">
<header>
<h1>Matching Game</h1>
</header>
<section class="score-panel">
<ul class="stars">
<li><i class="fa fa-star"></i></li>
<li><i class="fa fa-star"></i></li>
<li><i class="fa fa-star"></i></li>
</ul>
<span class="moves">3</span> Moves
<div class="restart">
<i class="fa fa-repeat" onclick="cardList1 = shuffle(cardList1); shuffleAlert()"></i>
</div>
</section>
<ul class="deck">
<li class="card">
<i class="fa fa-diamond"></i>
</li>
<li class="card">
<i class="fa fa-paper-plane-o"></i>
</li>
<li class="card match">
<i class="fa fa-anchor"></i>
</li>
<li class="card">
<i class="fa fa-bolt"></i>
</li>
<li class="card">
<i class="fa fa-cube"></i>
</li>
<li class="card match">
<i class="fa fa-anchor"></i>
</li>
<li class="card">
<i class="fa fa-leaf"></i>
</li>
<li class="card">
<i class="fa fa-bicycle"></i>
</li>
<li class="card">
<i class="fa fa-diamond"></i>
</li>
<li class="card">
<i class="fa fa-bomb"></i>
</li>
<li class="card">
<i class="fa fa-leaf"></i>
</li>
<li class="card">
<i class="fa fa-bomb"></i>
</li>
<li class="card open show">
<i class="fa fa-bolt"></i>
</li>
<li class="card">
<i class="fa fa-bicycle"></i>
</li>
<li class="card">
<i class="fa fa-paper-plane-o"></i>
</li>
<li class="card">
<i class="fa fa-cube"></i>
</li>
</ul>
</div>
<button onclick="createNewCardList(cardList1)">createNewCardList</button>
<ul id="testCard69" class="deck1 testCardDisplay">
</ul>
</body>
<script src="scripts/index.js"></script>
</html>
/ *我的js文件* /
/*
* Create a list that holds all of your cards
*/
var cardList2 = ["fa-diamond","fa-diamond","fa-diamond","fa-diamond","fa-paper","fa-paper","fa-anchor","fa-anchor","fa-bolt","fa-bolt","fa-cube","fa-cube","fa-leaf","fa-leaf","fa-bicycle","fa-bicycle","fa-bomb","fa-bomb"];
/*
* Display the cards on the page
* - shuffle the list of cards using the provided "shuffle" method below
* - loop through each card and create its HTML
* - add each card's HTML to the page
*/
var displayCards = document.querySelector(".testCardDisplay");
/*displayCards.appendChild(cardList)*/
function createNewCardList(cardlist){
var ulCreation = document.createElement('ul');
ulCreation.className = "";
for(i=0; i < cardlist.length; i++ ){
var liCreation = document.createElement('li');
liCreation.className = "card";
/*liCreation.innerHTML = cardlist[i]; oldWorkingVersion*/
/*liCreation.innerHTML = <i class="fa cardlist[i]"></i>;*/
var iCreation = document.createElement('i');
iCreation.className = "fa ";
iCreation.className += cardlist[i];
liCreation.append(iCreation);
ulCreation.append(liCreation);
ulCreation.className = "deck";
}
/*var ulDock = document.getElementsByClassName("testCardDisplay");*/
var ulDock = document.getElementById("testCard69");
ulDock.parentNode.replaceChild(ulCreation, ulDock);
};
// Shuffle function from http://stackoverflow.com/a/2450976
function shuffle(array) {
var currentIndex = array.length, temporaryValue, randomIndex;
while (currentIndex !== 0) {
randomIndex = Math.floor(Math.random() * currentIndex);
currentIndex -= 1;
temporaryValue = array[currentIndex];
array[currentIndex] = array[randomIndex];
array[randomIndex] = temporaryValue;
}
return array;
}
function shuffleAlert() {
setTimeout(function(){ alert("Cards have been reshuffled"); }, 0);
}
/*
* set up the event listener for a card. If a card is clicked:
* - display the card's symbol (put this functionality in another function that you call from this one)
* - add the card to a *list* of "open" cards (put this functionality in another function that you call from this one)
* - if the list already has another card, check to see if the two cards match
* + if the cards do match, lock the cards in the open position (put this functionality in another function that you call from this one)
* + if the cards do not match, remove the cards from the list and hide the card's symbol (put this functionality in another function that you call from this one)
* + increment the move counter and display it on the page (put this functionality in another function that you call from this one)
* + if all cards have matched, display a message with the final score (put this functionality in another function that you call from this one)
*/
/*document.getElementsByClassName("fa").addEventListener("click",checkStatus);*/
var clickedCard = document.getElementsByClassName("card");
console.log(clickedCard.length+"pre")
var currentCard ;
let ListofOpenCardskids = [];
var ListofOpenCards = [];
var currentCounterVal =0;
var parentOfClick = document.querySelector(".deck");
parentOfClick.addEventListener("click", afterClick,false);
function afterClick(e){
if (e.target !== e.currentTarget){
var clickedItem = e.target.children[0].className;
console.log("clickedItem:" + clickedItem);
console.log("eTargetClassname:" + e.target.className);
/*e.target.className += " open show";*/
displayCard(e);
checkIfInList(e);
counterWatch()
console.log("counterwatch"+currentCounterVal);
}
e.stopPropagation();
}
function displayCard( currentCard){
currentCard.target.className += " open show";
};
function checkIfInList(currentCard){
ListofOpenCardskids.push(currentCard.target.children[0].className);
ListofOpenCards.push(currentCard.target.className);
console.log("ListofOpenCardskids :"+ ListofOpenCardskids[0] + ListofOpenCardskids[1]);
if (ListofOpenCardskids[0] === ListofOpenCardskids[1]){
console.log("same two values in ListOfOpenCardArray")
/*keepCardsopen;*/
ListofOpenCardskids[0] += " match";
ListofOpenCardskids[1] += " match";
console.log(ListofOpenCardskids);
}
else
{
/*ListofOpenCards[0] -= " open show";
ListofOpenCards[1] -= " open show";*/
ListofOpenCards[0].target.className.removeClass(" open show");
ListofOpenCards[1].target.className.removeClass(" open show");
console.log("different values in ListOfOpenCardArray" + ListofOpenCardskids[0] + ListofOpenCardskids[1]);
/* var coverCards = function( ListofOpenCards ){
ListofOpenCards[0].target.className.removeClass(" open show");
ListofOpenCards[1].target.className.removeClass(" open show");
}; */
}
};
function counterWatch (){
currentCounterVal += 1;
};
/*
function coverCards( ListofOpenCardsP ){
ListofOpenCardsP[0].target.className.removeClass(" open show");
ListofOpenCardsP[1].target.className.removeClass(" open show");
}; */