带有“OR”运算符的jQuery属性选择器可能吗？

是否可以使用“OR”运算符或类似的方法重新编写以下选择器？带有“OR”运算符的jQuery属性选择器可能吗？

$("a[href$='avi'], a[href$='mov'], a[href$='mp4'], a[href$='m4v']")

理想情况下是这样的：

$("a[href$='avi|mov|mp4|m4v']") // incorrect

拿到几英里了我的键盘。我有一个test fiddle。

来源

2011-10-17 Ross

你可以添加自己的正则表达式选择器（http://james.padolsey.com/javascript/regex-selector-for-jquery/），但它可能是不值得为这。 –

谢谢。举例来说，这不值得，但在其他地方它是有用的。 – Ross

@ T.J。我不想*可能*在大型网络应用程序中部署此功能。给出的例子是一个简单而基本的测试用例，用于说明目的，以避免a）冗长，b）像我想玩jQuery代码高尔夫。像正则表达式正是我正在寻找的东西。感谢评论被标记为正确的答案，对我来说这是一个有趣的讨论点。 – Ross

你可以通过使用James Padolseys Regex Selector for jQuery来扩展jQuery。当你想把正则表达式放入选择器时非常有用。

Run this code in Test fiddle

jQuery.expr[':'].regex = function(elem, index, match) { 
    var matchParams = match[3].split(','), 
     validLabels = /^(data|css):/, 
     attr = { 
      method: matchParams[0].match(validLabels) ? 
         matchParams[0].split(':')[0] : 'attr', 
      property: matchParams.shift().replace(validLabels,'') 
     }, 
     regexFlags = 'ig', 
     regex = new RegExp(matchParams.join('').replace(/^\s+|\s+$/g,''), regexFlags); 
    return regex.test(jQuery(elem)[attr.method](attr.property)); 
} 

$("a[href$='avi'], a[href$='mov'], a[href$='mp4'], a[href$='m4v']") 
    .addClass("select"); 


$('a:regex(href,avi|mov|mp4|m4v)').addClass("betterSelect");

来源

2011-10-17 09:37:20

@Ross：请注意，虽然*真的很酷*，这将过滤到JavaScript层，甚至在可以支持一系列逗号分隔属性结束的浏览器上直接使用选择器在'querySelectorAll'（这是很多这些天），影响性能。另外，请注意，Padolsey的东西在每个匹配标签名称的**元素上调用'jQuery（elem）'。每次调用'jQuery（）'都涉及几个函数调用和一些内存分配。所以这是非常棒的东西，非常酷，但要留意性能影响。 –

不，CSS没有这个（它将在attribute selectors区域），jQuery也没有添加它（请参阅"attribute ends with" docs）。

你可以，当然，给自己一个效用函数这样做，如果你不介意不能够在|字符匹配，东西隐约这样的：

(function($) { 
    $.attrEndsWith = attrEndsWith; 
    function attrEndsWith(tag, attr, list) { 
     return $(tag + "[" + attr + "$='" + list.split("|").join("'], " + tag + "[" + attr + "$='") + "']"); 
    } 
})(jQuery);

和使用，因此：

$.attrEndsWith("a", "href", "avi|mov|mp4|m4v");

这是未经测试的，但你明白了。

来源

2011-10-17 09:19:51

$("a").filter(function(){ return /(avi|mov|mp4|m4v)$/i.test($(this).attr('href')); }).addClass('betterSelect');

并非真的是你要找的答案，但也许会有所帮助。

来源

2011-10-17 09:23:09 spicavigo

这会将过滤器放入JavaScript层，即使是在支持一系列以逗号分隔的属性结束的浏览器中，直接在querySelectorAll中（这些日子有相当数量的）选择器，影响性能。如果性能不是问题，那很好，但是...（另外，绝对没有理由做$（this）.attr（'href'）'和所有需要的内存分配和函数调用;'this .href'被普遍支持。） –

带有“OR”运算符的jQuery属性选择器可能吗？

回答

相关问题