基于上下文的getElementById比本机getElementById慢1000倍.像sizzle这样的选择器引擎是否采用了更聪明的策略？

Question

我有兴趣在dom之前构建html块,然后将它们插入到dom中,我已经使用dynatrace进行了一些测试.我使用了bobince的方法: 有没有办法在documentFragment中找到一个元素？

我发现它差不多1000倍(在IE7中),这让我很惊讶.

由于该功能非常基本,我想知道引擎使用的策略,如sizzle.

我想知道是否有更有效的方法来进行基于上下文的节点选择？

Answer 1

框架选择器引擎通常先从右手开始评估，所以我希望有一个上下文 ID 选择器到document.getElementByIdID，然后通过增加 s 来检查结果是否在上下文节点中parentNode。这相当快，但对于像本例这样的文档外 DOM 树不起作用。然后选择器引擎将不得不以极其缓慢的方式执行此操作，或者不关心（例如，Sizzle 不适用于DocumentFragment）。

\n\n

对于实现Selectors-API 的浏览器（IE8、Firefox 3.5、Opera 10、Safari 3.1、Chrome 3），有一种更好的方法可以在我记得的片段中获取 ID 。您可以使用querySelector将 CSS 选择器作为上下文节点来应用DocumentFragment，因为 API 需要DocumentFragment实现NodeSelector：

\n\n

alert(frag.querySelector(\'#myId\'))\n

\n\n

这不像 DOM 版本那么快getElementById，但它的加载速度比 DOM 版本更好。

\n\n

不幸的是，大多数具有 Selectors-API 优化的框架不会在这种情况下或任何其他具有上下文节点的情况下使用它们，因为上下文节点的工作方式与框架传统上实现它的方式不同querySelector，All这使得它们不兼容。

\n\n

选择器-API 级别 2提出了 \xe2\x80\x98scoped\xe2\x80\x99 方法，其行为类似于传统框架选择器...需要一段时间才能使用，但我们可能不会在此之前请参阅现有框架中优化的上下文选择器。我认为这是一种耻辱，因为虽然querySelector使用上下文节点进行过滤而不是范围界定的方法不太好，但它仍然对所有常见情况都非常有用。

\n