javascript - 尝试根据指定的 jQuery 索引号将类添加到 div

Question

我使用以下命令将一系列 div 附加到我的 $board 父级:

    var $board = $('<div id="board"></div>');
    var $row = $('<div class="row"></div>');
    var $cell = $('<div class="box stdBG"></div>')
    var $aRow;
    var $aCell;
    for (var i=0; i < 17; i++){
        $aRow = $row.clone();
        $board.append($aRow);
        for (var j =0; j <25; j++){
            $aCell = $cell.clone();
            $aRow.append($aCell); 
            if (i===8 && j==12){
                $aCell.removeClass('stdBG').addClass('marvin');
                indexI = i;
                indexJ = j;
            }
        }
    } 

这工作正常，但随后我尝试使用以下方法将 'marvin' 类添加到相邻的 div:

    indexJ += 1;
    $('.row').eq(indexI).find('.cell').eq(indexJ).addClass('marvin');

它没有做任何事情，我也没有收到任何错误消息。这位菜鸟需要帮助!

Answer 1

您的主要问题是您正在寻找不存在的 .cell 类。它一定是.box。

$('.row').eq(indexI).find('.cell').eq(indexJ).addClass('marvin');

我已经制作了这个片段并且运行良好:

var indexI = 0,
  indexJ = 0;

var $board = $('#board');
var $row = $('<div class="row"></div>');
var $cell = $('<div class="box stdBG"></div>');

for (var i = 0; i < 17; i++) {
  var $aRow = $row.clone();
  $board.append($aRow);
  for (var j = 0; j < 25; j++) {
    var $aCell = $cell.clone();
    $aRow.append($aCell);
    if (i === 8 && j === 12) {
      $aCell.removeClass('stdBG').addClass('marvin');
      indexI = i;
      indexJ = j;
    }
  }
}

indexJ += 1;
$('.row').eq(indexI).find('.box').eq(indexJ).addClass('marvin');

div {
  line-height: 0
}

.box {
  width: 10px;
  height: 10px;
  display: inline-block;
  border: solid 1px #fff
}

.stdBG {
  background: grey
}

.marvin {
  background: pink
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="board"></div>