1

jQueryは初めてです。単一のjqueryステートメントで各順序なしリスト（ul）の最初の3つのリストアイテム（li）を選択したい。次のコードを使用している-

 <div>
First Unordered List  :
    <ul>
        <li>First Ul li1 want to select</li>
        <li>First Ul li2 want to select</li>
        <li>First Ul li3 want to select</li>
        <li>First Ul li4</li>
        <li>First Ul li5</li>
        <li>First Ul li6</li>
    </ul>
    Second Unordered List
     <ul>
        <li>Second Ul li1 want to select</li>
        <li>Second Ul li2 want to select</li>
        <li>Second Ul li3 want to select</li>
        <li>Second Ul li4</li>
        <li>Second Ul li5</li>
        <li>Second Ul li6</li>
    </ul>
</div>

ここで、順序付けされていないリストは2つ以上になる可能性があります。

前もって感謝します..

4

6 に答える 6

4

:ltセレクター+findメソッドを使用できます。

$('ul').find('li:lt(3)');

http://jsfiddle.net/w4EgP/

于 2013-01-08T08:08:29.893 に答える
3

これは正常に機能します。

 $('ul').find('li:lt(3)');
于 2015-03-24T12:12:44.590 に答える
0

：ltセレクターと関数を使用eachしてループし<ul>、最初の3つを取得します<li> 

$("div > ul").each(function(){
 console.log($(this).find('li:lt(3)'));
})

ここをいじる

于 2013-01-08T08:08:53.230 に答える
0

次のコードを使用できます。

$("div > ul").find("li:lt(3)").each(function(index, value)
  {
$(this).css('color','Red');
});
于 2013-01-08T08:10:43.790 に答える
0

使用するよりも効率的に必要な要素を一度に取得するネイティブCSS3セレクターがあります:lt

ul > li:not(:nth-child(n + 4))

http://jsfiddle.net/alnitak/kS7q5/を参照してください

于 2013-01-08T09:27:24.400 に答える
-1

完全なコードは次のとおりです。

<script src="js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){

    var unorder_list = $('div>ul');
    unorder_list.each(function(){
        $(this).find("li:lt(3)").css('color','red');

    });
});
</script>
<body>
<div>
First Unordered List  :
    <ul>
        <li>First Ul li1 want to select</li>
        <li>First Ul li2 want to select</li>
        <li>First Ul li3 want to select</li>
        <li>First Ul li4</li>
        <li>First Ul li5</li>
        <li>First Ul li6</li>
    </ul>
    Second Unordered List
     <ul>
        <li>Second Ul li1 want to select</li>
        <li>Second Ul li2 want to select</li>
        <li>Second Ul li3 want to select</li>
        <li>Second Ul li4</li>
        <li>Second Ul li5</li>
        <li>Second Ul li6</li>
    </ul>
</div>
</body>
于 2013-01-08T08:15:08.920 に答える