親を知らずに N 番目の要素を選択するにはどうすればよいですか?

親要素の知識なしで n 番目の子を選択する

動的コードを使用する場合、親要素が存在しないときに n 番目の要素を選択するのは困難な場合があります。は不明です。ただし、これは、:first-child や :nth-child().

:first-child および :nth-child()

これらのセレクターを使用すると、親要素内の位置に基づいて要素を選択できます。たとえば、:first-child は最初の子要素を選択し、:nth-child(2) は 2 番目の子要素を選択します。

:first、:last、:nth が存在しない理由

:first-child や :nth-child() とは異なり、:first、:last、および:nth は、要素が文書全体の最初、最後、または n 番目の要素であるかどうかの区別がないため、存在しません。ルート要素を除き、すべての要素は別の要素の子です。

例

次の例で 2 番目の段落を選択するには、次のセレクターを使用します。

<youdontknowwhat!>
  <p class="select-me">One</p>
  <p class="select-me">Two</p>
</youdontknowwhat!>

.select-me:nth-child(2)

このセレクターは、親に関係なく 2 番目の .select-me 要素を選択します。要素。

以上が親を知らずに N 番目の要素を選択するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。