javascript - 如何在 JQuery 中更好地选择具有不同属性值的多行

Question

我有一张有很多行的桌子。每行都有一个名为“row_id”的属性，下面还有一个查询，可以让我找到我正在寻找的行。虽然这可行，但我真的很想用一种更短的方式来编写这个查询。

var rows = jQuery("tr[row_id='apple'], tr[row_id='banana'], tr[row_id='cherry']");

同样，上面的代码确实有效，但是有没有办法用更少的代码来编写它？如果我只需要写一次 tr[row_id=' 而不是一遍又一遍，那就太好了。

澄清：我每次都会寻找一组不同的row_id。我不会希望获取仅具有 row_id 属性的每个表行。

Answer 1

你也可以使用filter。

var rows = jQuery('tr[row_id]').filter(function(){
    return /apple|banana|cherry/i.test(this.getAttribute('row_id'));
});

小提琴

您也可以通过这种方式使其更通用：

var list= ["Apple", "banana", "cherry"]; //get the array of matches you need
var regexp = new RegExp("^(" + list.join('|') + ")$", "i"); //create the expression.


var rows = jQuery('tr[row_id]').filter(function(){
    return regexp.test(this.getAttribute('row_id')); //test it 
});

演示

或者用同样的方法让你的选择器运行起来：

var list= ["apple", "banana", "cherry"];
var selector = 'tr[row_id=' + list.join('], tr[row_id=') + ']';

var rows = jQuery(selector);

演示

Answer 2

这可能有效，但可能会慢很多。而且代码不少。

但是在正则表达式上添加所有 yout 过滤器更容易（你可以只使用一个Array.join()）；

jQuery("tr[row_id]").filter( function(i) {
    return /(apple|banana|cherry)/.test( $(this).attr("row_id") );
});