Javascript 如何测试类是否包含在div id中

我正在制作一个简单的口袋妖怪卡片游戏，当玩家点击任意一个口袋妖怪id（

#pikachu

，

#squirtle

等）时，它会出现在一个名为

#playerArea

的分区id中，点击的下一个口袋妖怪id应该出现在

#defenderrarea

中。我需要测试共享

.pokemon

类的元素是否在

#playerArea

中，以使下一个点击的pokemon出现在

#defencerarea

下面的HTML和脚本（不包括css）

口袋妖怪竞技场
100
200
150
120
300
攻击
$（文档）.ready（函数（）{
$（'#pikachu'）。单击（函数（）{
美元（“#皮卡丘”）。附录（“#玩家区”）；
});
});
$（文档）.ready（函数（）{
$（'#squirtle'）。单击（函数（）{
美元（“#squirtle”）。附于（“#playerArea”）；
});
});
$（文档）.ready（函数（）{
$（'#charmander'）。单击（函数（）{
$（“#charmander”）。附于（“#playerArea”）；
});
});
$（文档）.ready（函数（）{
$（'#bulbasaur'）。单击（函数（）{
$（“#bulbasaur”）。附于（“#playerArea”）；
});
});
$（文档）.ready（函数（）{
$（'#mario'）。单击（函数（）{
$（“#马里奥”）。附于（“#玩家区”）；
});
});
if（$（'#playerArea'）.hasClass（“.pokemon”））{
//做点什么
警惕（“游戏区有一只口袋妖怪”）；
};

---

我应该使用if/else语句来测试playerArea，还是应该使用if/else来查看是否单击了ID？

您可以使用一个单击处理程序（基于良好的选择器）来执行此操作，使用

this

来知道单击了哪个口袋妖怪，并使用三元运算符（同样在单击处理程序中）来决定将其附加到何处：

//find a count of how many pokemon are children of the playerArea
if( $('#playerArea').find('.pokemon').length > 0 ) {
  //put pokemon in defender area
}

$(document).ready(function() {
    $('#selectionArea .pokemon').click(function() {  
        $(this).appendTo($('#playerArea .pokemon').length ? "#defenderArea" : "#playerArea");
    });
});

---

请注意，您可以将所有这些可用于文档的方法组合成一个方法。1。您不需要将每个单击事件包装在其自己的

$（文档）中。就绪（…）

，您只需将整个事件包装一次即可。2.我建议根据对象、数组、变量等来确定pokemon的逻辑走向，而不是每次都简单地依赖DOM。它不仅会更干净，而且可以避免重复进行昂贵的DOM查找。

$(document).ready(function() {
    $('#selectionArea .pokemon').click(function() {  
        $(this).appendTo($('#playerArea .pokemon').length ? "#defenderArea" : "#playerArea");
    });
});