本文主要是介绍XPath 与 CSS 定位方式，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

• XPath
  • XPath 简介
  • XPath 表达式
  • XPath 运算符
  • 亲属关系匹配
  • 综合示例
• CSS Selector（选择器）
• XPath 与 CSS Selector 区别

XPath

XPath 简介

什么是 XPath？

• XPath 是一门在 XML 文档中查找信息的语言。

• XPath 使用路径表达式来选取 XML 文档中的节点或者节点集，这些路径表达式和我们在常规的电脑文件系统中看到的表达式非常相似。

• XPath 含有超过 100 个内建的函数。这些函数用于字符串值、数值、日期和时间比较、节点和 QName 处理、序列处理、逻辑值等等。

XPath 术语

• 在 XPath 中，有七种类型的节点：元素、属性、文本、命名空间、处理指令、注释以及文档（根）节点。

• XML 文档是被作为节点树来对待的。

• 树的根被称为文档节点或者根节点。

XPath 表达式

XPath 运算符

亲属关系匹配

综合示例

http://www.w3school.com.cn/example/xmle/books.xml

CSS Selector（选择器）

XPath 与 CSS Selector 区别

1）CSS Selector 比 XPath 速度快，特别是在 IE 下面（IE 没有自己的XPath 解析器）。

2）对于文本的处理，xpath 的使用更强大。

需要注意的是，Xpath 的 text() 获取的是当前元素的文本，而不包括其子元素的文本。

• 示例元素：

<div id="id1">
    <span>Memo<span>
    Please click here
</div>

• XPath 的 text() 得到的结果是 "Please click here" 。
• CSS 的 $("#id1").text() 获取的则是 "Memo Please click here" 。
• 使用 selenium 获取元素 text 也是 "Memo Please click here" 。

3）对于 class 属性，CSS 能直接模糊匹配；而 Xpath 对于 class 属性跟普通属性一致，需要使用 contains() 函数才能匹配部分字符串。

• 示例元素：

<div class="class1 popup js-dragable alert-msg">
    <div class ="class2 submit-box ">
            <input class ="class3"/>            
    </div>
</div>

• 表达式：

String locatorXpath1 = "//div[@class='class1 popup js-dragable alert-msg']//input[@class='class3']";
String locatorXpath2 = "//div[contains(@class,'popup js-dragable alert-msg')]//input[@class='class3']";

String locatorCss = ".class1.js-dragable .class3"

4）使用祖先元素属性与当前元素属性组合处理时。

• 示例元素：

<div class="111">
    <div>
        <div>
            <input class = "222"/>
        </div>
    </div>
</div>

• 表达式：

String locatorXpath1 = "//div[@class='111'/*/*/*[@class='222']]";
String locatorXpath2 = "//div[@class='111'//[@class='222']]";

String locatorCss = ".111 .222";   

5）模糊匹配。

模糊匹配属性值中的部分文本：

这篇关于XPath 与 CSS 定位方式的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！