1

我一直在玩几个选项,包括 jQuery 过滤器和我自己的递归下降函数,到目前为止,我对我的结果并不满意。

我将深入研究,看看我可以如何高效地编写我的代码;不过,我敢打赌,其他人已经做到了这一点,并且做得很好。

那么,对我来说搜索 dom 树最有效的方法是什么?比如说,我想找到所有具有匹配 ( /.*google.*/)的 src 属性的元素

4

3 回答 3

4

像这样的东西。

$("[src*='/google/']", "#rootnode")

或者

$("#rootnode [src*='/google/']")

查看这个测试用例(根据统计数据,第一个选择器的速度是第二个选择器的 14 倍,使用完全相同的选择器)
http://jsperf.com/test-selectorfidd123

想知道为什么?如果你使用第二个选择器,jQuery 必须循环遍历它可以找到的每个元素。如果您使用第一个,jQuery 将寻找root它将使用层次结构的最高节点的节点。并且不会遍历所有其他DIVScus 这不是必需的。

几个月前,我又做了一些测试。如果您使用能够在 CSS 中运行的选择器。jQuery 能够querySelector从本机库中使用。但是如果你使用像:selectedor这样的特殊选择器,:nth-child那么 jQuery 必须使用 Javascript 来循环遍历这些元素。在这种情况下,最好执行以下操作:(其中 jQuery 将querySelector用于第一部分,JS 用于.find

$("#native").find(":selected"); is faster than $("#native :selected");


信息:
属性包含选择器
Selector API

于 2012-10-11T20:05:15.640 回答
1

我认为今天超过 90% 的浏览器都支持原document.querySelectorAll(..)document.querySelector(..)代码。您应该能够使用:

document.querySelectorAll('[src*="/google/"]');

这应该比从 JavaScript 代码本身编写的任何东西都要快。如果它也可用,jQuery 应该使用它。

于 2012-10-11T20:07:41.207 回答
0

取决于你所说的高效。如果您的意思是“优雅”,如易于阅读,那么 Niels 是对的。如果您的意思是在速度方面高效,那么您使用 jQuery 是错误的。

是的,提到的其他方法也可以,但它们可能是更好的方法。也许您的页面上只有十几个元素,这很好。但是当有 100 或 1,000 人时,你会怎么做?搜索所有这些元素非常昂贵。

这是你应该问的问题:

这些元素是如何创建的?在创建它们时,我如何标记我以后需要的那些。

于 2012-10-11T20:18:46.030 回答