Question

如何使用JQuery搜索具有特定属性值的元素，而不管属性标记是什么？

像：

$("[*='myvalue']")

应该找到

<a href="target.html" target="myvalue">...
<tr change="myvalue">...

第一个，因为＆＃34;目标＆＃34;属性，第二个用于＆＃34;更改＆＃34;属性。

有没有比仅迭代所有属性更好的解决方案？

Answer 1

您可以使用自定义伪选择器来过滤属性。

以下是一种jQuery方式。

$.expr[":"].attrFilter = function(elem, index, val){
    var len = $(elem.attributes).filter(function () {
        return this.value === val[3];
    }).length;
    if (len > 0) {
        return elem;
    }
};
$('body *:attrFilter("value")').hide();

<强> Fiddle Demo

$.expr[":"].attrFilter是自定义选择器的扩展机制。您也可以传递参数。

语法：

$.expr[':'].selector = function(elem, index, match) { 

}

elem是当前的DOM元素
index是elem的索引
match是一个包含有关自定义的所有信息的数组选择器，传递的参数位于第3个索引处。（Reference 1，Reference 2）
- match[0] - 包含完整的伪类选择器调用。在此示例中：attrFilter("value")
- match[1] - 仅包含选择器名称。在此示例中attrFilter
- match[2] - 表示在参数 - 表达式中使用哪种引号（如果有）。即单（'）或双（“）。在这例如，它将是空的。
- match[3] - 给出参数，即括号中包含的参数。在这个例子中，`value

Answer 2

是的，这里也将采用相同的方法。Reference

 var elements = document.getElementsByTagName("*");
 for (var i = 0; i < elements.length; i++) {
 var element = elements[i];
 var attr = element.attributes;
 for (var j = 0; j < attr.length; j++) {
    if (attr[j].nodeValue == 'myvalue') {
        element.style.backgroundColor = 'red';
    }
  }
}

Answer 3

这是一个功能扩展，可用于查找所需的元素。

＆＃13;

jQuery(function($) {
  $.fn.filter_by_attr_value = function(value) {
    return this.filter(function() {
        // [].some() would be better here
        return $.grep(this.attributes, function(attr) {
            return attr.nodeValue == value;
        }).length;
    });
  };

  $('*').filter_by_attr_value('myvalue').css('background', 'lightgreen');
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="target.html" target="myvalue">FOO</a>
<table>
<tr change="myvalue">
  <td>BAR</td>
</tr>
</table>
<div>not me</div>

＆＃13;

Answer 4

这可以在不使用普通JavaScript或VanillaJS的JQuery的情况下完成，因为需要调用其他名称。我把include包括在内是因为大多数时候我们搜索子字符串：

var all  = document.getElementsByTagName("*");
for (el of all) for (attr of el.attributes) if (attr.nodeValue.includes("myvalue")) console.log(attr.ownerElement)

JQuery选择器使用值，但未知属性

4 个答案: