jquery - jQuery：有没有办法使用数组选择器选择多个元素？

Question

是否可以使用数组选择器选择多个元素？

如果是这样，最好的方法是什么？在我的项目中，我只需要使用数组选择器。

这是我的示例代码：

<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'});
})​

Answer 1

这将给出预期的结果。只需按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 ），那么我会返回；跳过执行。

Answer 2

这是一种性感的方法：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();

如您所愿的自定义通用快捷方式:)

Answer 3

一种选择是使用filter；

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

还使用$.inArray和index()。查看演示。

Answer 4

也许这会起作用（但性能不太好）：

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

或这个：

$('ul li:eq(0),ul li:eq(2)');

Answer 5

您也可以使用 forEach of array

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

这是小提琴

Answer 6

循环它

$('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' });
    }
});