[Selenium] 在Chrome的开发者工具中验证检查XPath/CSS selectors

最新推荐文章于 2024-05-23 10:27:35 发布

转载最新推荐文章于 2024-05-23 10:27:35 发布 · 295 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/MasterMonkInTemple/p/10558057.html

文章标签：

#python

本文介绍了在Chrome开发者工具中评估和验证XPath/CSS选择器的方法。方法一是在Elements面板，通过搜索功能评估并高亮匹配节点；方法二是在Console面板，执行$x(\some_xpath\)或$$(\css-selectors\)进行评估和验证，还说明了不同情况的结果展示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Evaluate and validate XPath/CSS selectors in Chrome Developer Tools

Method 1 : From Elements panel

Use the search function inside Elements panel to evaluate XPath/CSS selectors and highlight matching nodes in the DOM.

1.Press F12 to open up Chrome DevTools.
2.Elements panel should be opened by default.
3.Press Ctrl + F to enable DOM searching in the panel.
4.Type in XPath or CSS selectors to evaluate.
5.If there are matched elements, they will be highlighted in DOM. However, if there are matching strings inside DOM, they will be considered as valid results as well. For example, CSS selector header should match everything (inline CSS, scripts etc.) that contains the word header, instead of match only elements.

Method 2 : From Console panel

Execute tokens $x("some_xpath") or $$("css-selectors") in Console panel, which will both evaluate and validate.

1.Press F12 to open up Chrome DevTools.
2.Switch to Console panel.
3.Type in XPath like $x(".//header") to evaluate and validate.
4.Type in CSS selectors like $$("header") to evaluate and validate.
5.Check results returned from console execution
If elements are matched, they will be returned in a list. Otherwise an empty list [ ] is shown.
If the XPath or CSS selector is invalid, an exception will be shown in red text.