Javascript 为什么我的for循环从最后一项开始，在一次迭代后停止运行？

我的问题是关于createBoard（）函数，这里的第二个函数

执行时，循环从[cards]数组中的最后一项开始。它将“king”指定给第一个循环，然后循环停止。有什么见解吗

main.js

function createCards(){

var gameBoard = document.getElementById('game-board');

for(var i = 1; i <= 4; i++){

  //Create newCard as a Div 

    var newCard = document.createElement('div');

  //Add Class of .card to the NewCard   
    newCard.className = 'card';

  // Append card to the board   
    gameBoard.appendChild(newCard);
    }
}


createCards();




var cardsInPlay = [];

function createBoard() {

    var cards = ["queen", "queen", "king", "king"];

    for(var j = 0; j < cards.length; j++){

     document.querySelector(".card").setAttribute("data-card", cards[j]);

    // document.querySelector(".card").addEventListener("click", isTwoCards)
    }
}


createBoard();

函数createCards（）{
var gameBoard=document.getElementById（'game-board'）；
for（var i=1；i您的
for
循环不是从最后一个元素开始的，它只是覆盖您已经存在的值

通过反复使用
setAttribute
函数，您可以覆盖该值（最后设置的值就是您拥有的值）

我不确定您想要的结果是什么，但您可以将该值设置为旧值与新值的组合：

for(var j = 0; j < cards.length; j++){
    document.querySelector(".card").setAttribute("data-card", document.querySelector(".card").getAttribute("data-card") + cards[j]);
}

for（var j=0；j

例如。
你的
for
循环不是从最后一个元素开始的，它只是覆盖你已经在那里的值

通过反复使用
setAttribute
函数，您可以覆盖该值（最后设置的值就是您拥有的值）

我不确定您想要的结果是什么，但您可以将该值设置为旧值与新值的组合：

for(var j = 0; j < cards.length; j++){
    document.querySelector(".card").setAttribute("data-card", document.querySelector(".card").getAttribute("data-card") + cards[j]);
}

for（var j=0；j

例如。
您在这里重写。您可以通过从循环中分离来遵循这个简单的步骤

function createBoard() {

    var cards = ["queen", "queen", "king", "king"];
    var cardArr = document.getElementsByClassName("card");
    for(var j = 0; j < cards.length; j++){

    cardArr[j].setAttribute("data-card", cards[j]);
    }
}

函数createBoard（）{
var卡=[“女王”、“女王”、“国王”、“国王”]；
var cardArr=document.getElementsByClassName（“卡”）；
对于（var j=0；j

谢谢你在这里重写。你可以按照这个简单的步骤从循环中分离出来

function createBoard() {

    var cards = ["queen", "queen", "king", "king"];
    var cardArr = document.getElementsByClassName("card");
    for(var j = 0; j < cards.length; j++){

    cardArr[j].setAttribute("data-card", cards[j]);
    }
}

函数createBoard（）{
var卡=[“女王”、“女王”、“国王”、“国王”]；
var cardArr=document.getElementsByClassName（“卡”）；
对于（var j=0；j

谢谢
这个问题是关于createBoard（）函数的。我之前忘记说了。第一个是关于可见性的。这个问题是关于createBoard（）的函数。我忘了在前面说明。第一个是为了可见性。我正在尝试循环四张卡，并为每一张卡分配一个字符串。第一张卡将是皇后、第二皇后、第三国王……等等。但是
document.querySelector（“.card”）
将只取第一张，我正在尝试循环四张卡，并为每一张卡分配一个字符串。第一张卡将是皇后、第二皇后、第三国王……等等。但是
文档。查询选择器（“.card”）
将只取第一张