1

私は現在、クラスを含む各要素から最初の子孫要素を選択するためのメソッドを使用find()しています。しかし、メソッドは最初の要素が選択される前に一致する要素のセットを生成するため、これは非常に面倒です。以下は私のコードの骨組みです：first()<div>parentfind()

HTML

<div class=parent>
 <ul>
  <li>random characters</li>
  <li>random characters</li>
  <li>random characters</li>
  <li>random characters</li>
 </ul>
</div>
<div class=parent>
 <ul>
  <li>random characters</li>
  <li>random characters</li>
  <li>random characters</li>
  <li>random characters</li>
 </ul>
</div>
<div class=non-parent>
 <ul>
  <li>random characters</li>
  <li>random characters</li>
  <li>random characters</li>
  <li>random characters</li>
 </ul>
</div>
<div class=parent>
 <ul>
  <li>random characters</li>
  <li>random characters</li>
  <li>random characters</li>
  <li>random characters</li>
 </ul>
</div>
// .....the list continues

Javascript

$('.parent').each(function() {
 $(this).find('ul li').first().css('color', 'red');
// do other stuff (on other elements) within each loop
});

$(".parent li:first")セレクターを使っている人を見たことがあります。しかし、私はそれをループで行っているので、これをどのように行うことができるか、または行うことができるかどうかはわかりません。アドバイスが必要です。ありがとう。

明確化：

eachループ内のHTMLに表示されていない他の要素に対して他のことを行う必要があります。ありがとう。

4

4 に答える 4

2

各親の最初の要素をループする場合は、次のように実行できます。

$('.parent ul li:first-child').each(function() {
    $(this).css('color', 'red');
    // do other stuff within each loop
});

.css()ただし、メソッドは一致したすべての要素で動作するため、ループで実行する必要はありません。これも機能します：

$('.parent ul li:first-child').css('color', 'red');

それはそれらすべてを変えるでしょう。

すべてをループする場合の別のオプションliは次のとおりです。

$('.parent ul li').each(function() {
    if($(this).is(":first-child"))
        $(this).css('color', 'red');
    // do other stuff within each loop
});

更新：後で他のチェックを実行するよりも各親をループしたい場合は、次のことが役立ちます。

$('.parent').each(function() {
    // I assume that even if other uls are in parent, the ul you target is first

    $(this).find("ul li:first-child").first().css('color', 'red');

    // do other stuff within each loop
});
于 2012-06-30T03:13:48.127 に答える
1

:first外側のループとセレクターの両方を主張する場合は、次を使用します。

$('.parent').each(function() {
    $(this).find('li:first').css('color', 'red');
    // do other stuff within each loop
});

以下は機能しないことに注意してください。

$('.parent li:first').css('color', 'red');

li....すべての.parent要素から最初の子孫を選択するだけだからです。

于 2012-06-30T03:19:26.677 に答える
0

このhttp://api.jquery.com/first-child-selector/を見てください

ちなみに、foreachは必要ありません...！cssの変更をコレクションに直接適用してください！

$('.parent ul li:first-child').css('color', 'red');

この作業例http://jsfiddle.net/9ej5H/を参照してください。

Zee Teeの回答も問題ありませんが、読みにくくなっていることに注意してください。

于 2012-06-30T03:13:01.013 に答える
0

いつでもインデックスセレクターを使用できます：$(".parent ul li:eq(0)")

また

$(".parent ul li").eq(0)

注意：0最初のものです。

于 2012-06-30T03:21:32.603 に答える