HTML5数据属性中的通配符

是否可以在属性名称中使用带有通配符的jQuery查找所有DOM元素？

请考虑以下HTML：

我想要实现的是找到所有具有以data-validate-开头的属性名称的dom节点

据我所知， 这里描述的通配符与属性的“值”有关。

原因是 – 我想找出哪些元素应该被validation – 然后找出哪些validation参数（比如-email）正在发挥作用。

谢谢

Answer 1

您可以创建一个自定义伪类，例如将属性名称与正则表达式匹配： http ： //jsfiddle.net/hN6vx/ 。

 jQuery.expr.pseudos.attr = $.expr.createPseudo(function(arg) { var regexp = new RegExp(arg); return function(elem) { for(var i = 0; i < elem.attributes.length; i++) { var attr = elem.attributes[i]; if(regexp.test(attr.name)) { return true; } } return false; }; }); 

用法：

 $(":attr('^data-')") 

Answer 2

因为JQuery在很大程度上依赖于XPath ，并且XPath不支持通配符属性选择 – 如果没有您希望避免的开销，这是不可能的。

总是有可能创建自己的选择器，只是为了保持清洁：

 //adds the :dataValidate selector $.extend($.expr[':'],{ dataValidate: function(obj){ var i,dataAttrs=$(obj).data() for (i in dataAttrs) { if (i.substr(0,8)=='validate') return true; } return false; } }) 

这将允许您在普通的jQuery选择器中使用：dataValidate：

 $(".element:dataValidate .etc") 

工作JSFiddle： http ： //jsfiddle.net/rZXZ3/

Answer 3

你可以循环遍历属性：

 $('.element').each(function() { $.each(this.attributes, function(i, att){ if(att.name.indexOf('data-validate')==0){ console.log(att.name); } }); }); 

Answer 4

您可以使用filter方法和dataset对象：

允许在读取和写入模式下访问元素上设置的所有自定义数据属性（data- *）。 它是DOMString的映射，每个自定义数据属性都有一个条目。

 $("input").filter(function(){ var state = false; for (i in this.dataset) if (i.indexOf('validate') > -1) state = true; return state })​ 

http://jsfiddle.net/Pxpfa/