所以这是一个有趣的,很可能无法有效地完成.但我有兴趣找到一种有效的方法来查询文档中具有任何属性的特定值集的所有html元素.所以,例如,而不是这个:
document.querySelectorAll('[attrName]');
我正在寻找以下伪代码的等价物:
document.querySelectorAll('[*=specificValue]');
所以基本上结果将是具有任何属性的所有元素,其值与"specificValue"匹配.我知道有很多方法可以做到这一点,例如:
var all = document.querySelectorAll('*');
var matches = [];
var attrs;
for (var i = 0; i < all.length; i += 1) {
attrs = Array.prototype.slice.call(all[i].attributes);
for (var j = 0; j < attrs.length; j += 1) {
if (attrs[j].value === 'specificValue') {
matches.push(all[i]);
break;
}
}
}
但是,我真的很想避免分析这样的每一个html元素.有任何想法吗？
编辑:
感谢目前为止所有的帮助.在太多人给出替代建议之前,我应该解释一下这是什么.基本上,这是一个实验.我的想法是,我可能能够像Ember.js中那样创建实时的对象到数据绑定,但不必编译模板,您可以使用常规的html属性并在值本身中使用语法标记应该创建一个绑定.例如:<a href="{{linkLocation}}"></a>.我认为如果能够有效地选择相关元素,这可能会很有趣.显然我知道循环必须在某个地方发生.但是,如果浏览器正在运行本机迭代,我宁愿使用我自己的JavaScript循环.我只是不确定是否有一些我不知道的"秘密"选择器语法,或者是否有人能想到任何其他很酷的技巧.
如果你不寻找它，你就找不到它。因此，基本上您需要迭代所有元素。
但是，您可以使用一些简单的逻辑来至少帮助您提高性能。
定义上下文
例如，您可能有一个非常长的 HTML，但在其中可能有一个 DIV，只有在该 div 内部您的元素才可能具有值“specificValue”。在这种情况下，您知道您要查找的内容仅位于此 div 内，并且仅在其中进行搜索。
您仍然需要遍历所有元素，但这次不是在整个 HTML 中，而是仅在您期望值所在的 DIV 中。
因此，总结一下，无论您使用 jQuery 还是纯 JavaScript，您仍然需要检查所有元素。解决方案是通过定义上下文并仅在该上下文中进行搜索来缩小可搜索“区域”的范围。
例如
<html>
<head>
<title>some title</title>
</head>
<body>
.
.
<div class="searchable">
-- your elements that may have the value you will search
</div>
.
.
.
<div class="searchable">
-- your elements that may have the value again.
</div>
</body>
</html>
请注意 - 您将必须再次迭代所有元素才能找到类名为“searchable”的 div。jQuery$('.searchable')也能做到这一点。但您也可以为此定义一个上下文，并$('.searchable', 'body')缩小搜索范围。
| 归档时间： |
|
| 查看次数： |
711 次 |
| 最近记录： |