0

配列セレクターを使用して複数の要素を選択することは可能ですか?

もしそうなら、それを行う最善の方法は何ですか? 私のプロジェクトでは、配列セレクターのみを使用する必要があります。

これは私のサンプルコードです:

<ul>
    <li>1<li>
    <li>2<li>
    <li>3<li>
    <li>4<li>
    <li>5<li>
</ul>
<a href="#">select</a>​

$('a').click(function(){
    var element = $('ul').find('li')[0]; // Instead is it possible $('ul').find('li')[0,3,4]? I know we can select finding each alone. But is there any shortcut?
    $(element).css({border:'1px solid red'});
})​
4

6 に答える 6

7

これにより、望ましい結果が得られます。index()でフィルタリングし、inArray( )を使用するだけです。

var arr = [0, 3, 5];
$('ul li').each(function() {
    if ($.inArray($(this).index(), arr) < 0)
        return;
    // Code here!
    $(this).css('border', '1px solid red');
});

基本的に、すべて<li>が each() を介して実行され、次にループして、指定された .index() が指定された配列にあるかどうかを確認します。それらが存在しない場合 ( $.inArray() == -1 )、リターンを行います。実行をスキップします。

于 2012-05-04T09:17:01.267 に答える
1

Arrayこれを行うためのセクシーな方法は次のとおりです。別の回答で提案されているように、JavaScriptオブジェクトにカスタムメソッドを追加します。

Array.prototype.filter = function(indexes) {
    var array = new Array();
    for(var i=0; i<indexes.length; i++) {
        array.push(this[indexes[i]]);
    }
    return array;
};

それを呼び出すには:

$('ul').find('li').filter([0,3,4]).anything();

必要に応じてカスタムの汎用ショートカット:)

于 2012-05-04T09:27:53.063 に答える
1

1つのオプションは、フィルターを使用することです。

var indexArray = [1,3,4];
$('ul li').filter(function(index) {
    return jQuery.inArray($(this).index(), indexArray) > -1;
});

$ .inArrayindex()も使用します。デモを見る。

于 2012-05-04T09:28:31.573 に答える
0

たぶんこれはうまくいくでしょう(しかしパフォーマンスではあまり良くありません):

$('ul li:nth-child(0),ul li:nth-child(2)');

またはこれ:

$('ul li:eq(0),ul li:eq(2)');
于 2012-05-04T09:19:37.650 に答える
0

ループする

$('a').click(function() {
    var element = $('ul').children('li');
    var count = 0;
    for (x in element) {
        count++;
        if ((count == 0) || (count == 3) || (count == 5))
            x.css({ border: '1px solid red' });
    }
});
于 2012-05-04T09:26:14.973 に答える
0

配列の forEach も使用できます

arr = "013".split("");
arr.forEach(function(a,b){
    var element = $('li')[a]; 
    console.log(element);
    $(element).css({border:'1px solid red'});
});

フィドルはこちら

于 2012-05-04T09:23:12.833 に答える