selenium - Selenium 的 cssSelector 与 XPath

Question

根据我的理解，CSS 选择器遍历 DOM。因为 CSS 文件不会有任何关于元素位置的信息，所以为什么 cssSelector 比 XPath 更快(理论上)。

理论上，cssSelector 比 XPath 花费更少的时间，因为 XPath 需要遍历 HTML DOM。 XPath 我们可以在 DOM 层次结构中向后或向前搜索元素，而 CSS 只能向前搜索。

但是，如果cssSelector也遍历HTML DOM，那么它如何使cssSelector更快。

换句话说，cssSelector在内部是如何实际工作的，以及为什么它总是比xpath更适合/推荐每个人使用的原因

此外，请分享使用 cssSelector 相对于 XPath 的其他好处。

反之亦然，在哪些方面XPath比cssSelector更好

Answer 1

我读过很多文章，我见过一些像this这样的文章和 this有数据表明 CSS 选择器更快，我做了一些测试并得出了相同的结论。 2016 年 12 月，我与 elementalselenium.com 的作者 Dave Haeffner 进行了交谈，并向他询问了他网站上的性能数据(在我上面链接的帖子中)，因为这些数据已经很旧了。他linked me a presentation (参见第 18-23 页)他更新了测试，CSS 选择器仍然更快，但 XPath 在一些配置中正在迎头 catch 。

所以我们可以看到证据证明这是真的，但我从未见过有人谈论原因的技术细节。如果我猜的话，那是因为不同的浏览器已经做了很多工作来优化页面渲染的速度。让 CSS 选择器快速工作可以使页面渲染速度更快，并且由于浏览器驱动程序利用浏览器定位元素的能力，这意味着 CSS 选择器通常会获胜。我读到一些浏览器已经提高了它们的 XPath 定位器速度，但我认为它可能总是落后于 CSS 选择器，因为它比 CSS 选择器要少得多。

CSS 选择器和 XPath 都必须遍历 DOM，因此除了遍历引擎的速度之外，没有真正的区别。由于 CSS 选择器的广泛使用，CSS 选择器引擎在这一点上与 XPath 引擎相比可能是一台经过微调的机器。

我的一般定位器策略是 ID 优先，CSS 选择器用于其他所有内容。当其他方法都不起作用时，我使用 XPath。各个站点的情况会有所不同，但根据我的经验，ID 可能占我定位器的 10% 左右。 CSS 选择器大约占 80%，最后 10% 是 XPath。当我需要通过包含的文本来定位元素并且很少使用 DOM 遍历时，我通常使用 XPath。我的 XPath 使用示例可能是我需要在 TABLE 中查找相对于行标签的元素，例如表行中奶酪的价格，其中第一个单元格包含“奶酪”，第三个单元格包含价格。

我认为 XPath 在诸如 SO 之类的网站和许多博客上经常出现，因为它易于访问。我所要做的就是右键单击开发工具中的一个元素并复制 XPath。很多时候这个问题会生成一个糟糕的、脆弱的 XPath。手工制作的 XPath 更好，但手工制作好的 XPath 或 CSS 选择器需要时间和经验。许多人不愿意投入时间。精心设计的 CSS 选择器或 XPath 也会让事情变得更慢。很多时候，定位元素的方式有很多种，其中一些比其他更有效……这取决于定位器的效率以及如何使用它。格式错误的 CSS 选择器不会自动比格式正确的 XPath 更快。