这使用.filter()
限制考生那些具有data-api-*
属性。可能不是最有效的方法,但如果您可以先用相关选择器缩小搜索范围,则可用。
$("div").filter(function() {
var attrs = this.attributes;
for (var i = 0; i < attrs.length; i++) {
if (attrs[i].nodeName.indexOf('data-api-') === 0) return true;
};
return false;
}).css('color', 'red');
演示:http://jsfiddle.net/r3yPZ/2/
这也可以写为一个选择器。这是我的新手尝试:
$.expr[':'].hasAttrWithPrefix = function(obj, idx, meta, stack) {
for (var i = 0; i < obj.attributes.length; i++) {
if (obj.attributes[i].nodeName.indexOf(meta[3]) === 0) return true;
};
return false;
};
用法:
$('div:hasAttrWithPrefix(data-api-)').css('color', 'red');
演示:http://jsfiddle.net/SuSpe/3/
这个选择应该预先1.8版本的jQuery的工作。为1。8及以上,some changes may be required。下面是在一个标准的1.8版本的尝试:
$.expr[':'].hasAttrWithPrefix = $.expr.createPseudo(function(prefix) {
return function(obj) {
for (var i = 0; i < obj.attributes.length; i++) {
if (obj.attributes[i].nodeName.indexOf(prefix) === 0) return true;
};
return false;
};
});
演示:http://jsfiddle.net/SuSpe/2/
对于一个更通用的解决方案,下面是需要一个正则表达式模式与匹配模式的属性选择元素选择:
$.expr[':'].hasAttr = $.expr.createPseudo(function(regex) {
var re = new RegExp(regex);
return function(obj) {
var attrs = obj.attributes
for (var i = 0; i < attrs.length; i++) {
if (re.test(attrs[i].nodeName)) return true;
};
return false;
};
});
对于你的榜样,这样的事情应该工作:
$('div:hasAttr(^data-api-.+$)').css('color', 'red');
演示:http://jsfiddle.net/Jg5qH/1/
这个问题可能会有所帮助:[jquery的数据选择器(http://stackoverflow.com/questions/2891452/jquery-data-selector) – jrummell
将它始终是一个“DATA- “属性? – Ian
@ianpgall更可能,是的。它们会类似于某个点(比如data-api),那么属性名称的其余部分可能有意义。 –