1

私はこのような構造を持っています:

<div>
  <a></a>
  <p></p>
  <p></p>
</div>

そして、私はすべての p をすでに実数配列に持っています:

var p = [].slice.call( document.querySelectorAll('div p') );

最初のアイテムを取得できましp[0]たが、(この場合は同じです) が必要なfirst-childので、試しquerySelectorAllましたが、これを実行しても結果が得られません:

p.forEach(function( el ) {
  console.log( el.parentNode.querySelectorAll('p:first-child') ) //=> empty
});

もしそうなら、私が望むものではないものをel.parentNode.querySelectorAll(':first-child')手に入れます。配列内<a>の p をフィルタリングするにはどうすればよいですか?first-child

編集：ダミー要素を作成し、クローンを使用して構造を再作成して要素を見つけようとしましたが、それはちょっとうまくいきますが、それが最善のアイデアかどうかはわかりません...

4

1 に答える 1

5

first-of-typeCSS3には疑似クラスがあります。あまり広くサポートされているとは思いません。first-child疑似クラスは、親の子ノードリストの最初のものである任意のタイプの要素を選択する述語です。が最初に来るので、<a>で「ヒット」するのはそれだけです:first-child。

編集— caniuseによると、 whoa:first-of-typeは実際にはかなりよくサポートされているようです。

于 2013-01-12T01:06:53.670 に答える