2

我正在做我的个人项目，即创建一个 javascript 选择器引擎。引擎将使用 CSS2 - CSS3 语法来选择元素节点。我正在将我的引擎的选择结果与其他选择器引擎的结果（主要是 Sizzle）进行比较。我还将它与称为 querySelectorAll (QSA) 的本机选择器方法进行了比较。我注意到一个区别。

文档的 HTML 结构很简单：

<code><span></span></code>

我使用的选择器是：

'跨度，代码'

当我使用 Sizzle 或 QSA 进行选择时，我得到的结果是：

[<code>...</code>, <span></span>]

当我使用我的选择器引擎时，结果是这样的：

[<span></span>, <code>...</code>]

看起来，Sizzle 和 QSA 根据文档上元素的位置对集合进行排序。我的选择器引擎不这样做。我发现，可以使用 compareDocumentPosition 和 Array 排序方法来实现排序。显然这会对性能产生一点影响，虽然我还没有测试过。（来源：http ://ejohn.org/blog/comparing-document-position/ ）。

我想知道排序节点是否比“未排序”节点提供一些好处。例如，在对元素进行排序时，将 css 样式添加到集合的节点（即循环中）是否更有效。还有其他情况，使用排序集合可能更好吗？

示例（elementNodes 包含选择结果）：

for (var i = 0, il = elementNodes.length; i < il; i++) {

 elementNodes[i].style.height = '100px';

 elementNodes[i].style.width = '100px';

 elementNodes[i].style.background = 'red';

}

4

1 回答 1

0

首先，我喜欢你在这里所做的事情，尤其喜欢你正在与其他开源引擎进行比较。

实际上，这两个示例的“排序”方式不同。

除非你找到一个令人信服的理由（我想不出一个）以与嘶嘶声相同的方式对你的进行排序，否则不要这样做。只要您清楚自己的引擎的顺序，并且其他人也可以理解，那才是最重要的。

于 2012-05-21T16:29:24.137 回答