Selenium学习笔记目录
xpath:树型结构
1. 基本概念
使用方法：
find_element_by_xpath("...")根节点：
/-
子节点：
/html/body/...- 直接子节点
/body - 所有子节点（包括直接子节点和非直接子节点）
//body
- 直接子节点
当前节点用“.”表示
./body/...当前节点的上一层节点用“..”表示
../body/...从根节点开始查找
/a/b/c/d不从根节点开始查找（查找所有节点）
//c//b/d-
通配符用
*表示，*可以是任何一种类型//b//* 查找节点b下的所有元素- xpath与css方法对比
xpath css //div/*div > *
- xpath与css方法对比
-
根据属性查找
- 所有属性，包括id和class
- 示例01：查找属性含style的所有元素
//*[@style] - 示例02：查找p节点下属性spec=len2的元素
//p[@spec='len2']
-
xpath与css方法对比
xpth属性的值必须加引号，css如果没有空格可以不加引号
xpath css //*[@style] *[style] //p[@spec='len2'] p[spec=len2]
2. 举例应用
根据id选择
//*[@id='food']-
选择属于其父元素的第二个p
- xpath与css方法对比
xpath css //p[2] nth-of-type(2)
- xpath与css方法对比
-
选择属于其父元素的倒数第几个元素
- 最后一个p类型的子元素
//p[last()] - 倒数第二个p类型的子元素
//p[last(-1)] - 所有元素的倒数第二个
//*[last()]
- 最后一个p类型的子元素
-
根据位置选择
position表示位置
所有元素中的前两个元素
//*[position()<=2]除了第一个元素外的其他所有元素
//*[position()>1]所有元素中的最后三个元素
//*[position()>last()-3]-
xpath与css方法对比
- xpath:选择所有的p和所有的button(先选择所有的p再选择button)
//p | //button - css:选择所有的p和所有的button(按结构顺序选择)
p,button
- xpath:选择所有的p和所有的button(先选择所有的p再选择button)
-
当前节点下的所有直接子节点
- css:food下面所有的直接子节点中的div
#food ~ div - xpath:
//*[@id='food']/following-sibling::div - id为food的节点的子节点的第一个节点
//*[@id='food']/following-sibling::*[1] - id是food的上一个节点的div节点
//*[@id='food']/preceding-sibling::div - id为food的父节点(上层节点)
//*[@id='food']/..
- css:food下面所有的直接子节点中的div
-
当前目录与子目录
- 从根目录下开始查找所有的p：
'//p' - 从当前目录下开始查找所有的p：
'.//p' - 从当前节点的父节点开始查找所有的p：
'..//p' - 从当前目录下开始查找直接子节点的p：
'./p'
- 从根目录下开始查找所有的p：
3. 在浏览器中确认查找的元素是否正确
- 浏览器按F2进入开发者模式，点击console
- xpath与css方法对比
方法 路径前的符号 示例 xpath $x $x("//span")css $$ $$('span')
- xpath与css方法对比
- 浏览器按F2进入开发者模式，点击elements，按
ctrl+F进入搜索模式，输入xpath或css参数路径
4. 浏览器端根据html查看xpath
- 选中某个路径，点击鼠标右键，依次选择
copy-->copy xpath即可复制该元素的xpath
