javascript - 如何使用 javascript 选择部分标签内的所有 div？

Question

我正在用 javascript 制作一款回合制游戏。我想将播放器从 div 移动到 div。我已将所有这些 div 放在一个部分中，然后使用 queryselectorall 放入一个数组中。现在我的问题是我还有另一个我想使用的 div，我不能单独选择它们。谁能告诉我如何只选择一些 div？我见过类似 section>div 的东西来区分它们，但这对我不起作用。

我曾尝试在 rollDice、zar1 和 zar2 上用 span 替换 div，但这样做会破坏一些 CSS。

~
<div class="rollDice">Roll the dice</div>
<div class="zar1">
    <img src="poze/dice-5.png" alt="Dice" class="dice" id="dice-1" style="width:150px">
</div>

<div class="zar2">
    <img src="poze/dice-5.png" alt="Dice" class="dice2" id="dice-2"  style="width:150px">
</div>


<section class="mutari">
    <div class="nr1 mutabil"><h1>1</h1></div>
    <div class="nr2 mutabil"><h1>2</h1></div>
    <div class="nr3 mutabil"><h1>3</h1></div>
</section>
~

我只想从该部分中选择 div。然后我想选择前 3 个 div。

Answer 1

您正在寻找的是:

document.querySelectorAll('section > div:nth-child(-n+3)')

section (a type selector ) 找到您的 <section> .如果你有更多的部分元素，你可以使用 section.mutari更准确地说(使用 class selector )。

> div选择所有 <div>该部分的直接子标签。 >是 child combinator .

:nth-child(-n+3) , 一个 pseudo-class , 将其限制为仅选择前三个元素，而不是全部。在您的示例中不需要它，因为您只有三个 div；但如果你有更多，这只会给你前三个。