所有的细节全部已经验证通过,Python
可参考此篇文章《Python selenium —— 父子、兄弟、相邻节点定位方式详解》
另外,贴出来的代码全部取至于PPmoney官网。^_^ 小小滴广告一波啦。
由弟弟节点定位哥哥节点
id动态
咱们先看一下html代码
- 咱们需要定位在button x
- button x节点下的 系统提示节点的id属性属于动态属性 id是变化的
- 若当前页面还有其他以id=”title:xxx” 作为属性的div节点,另说。。
如何做 ?
1 | <td i="header" class="ui-dialog-header"> |
先定位到id, 因为是动态的所以咱们需要用到contains
下面的代码是指div节点id元素包含”title:”字符串
1 | By by = By.xpath("//div[contains(@id,'title:')]"); |
再定位到系统提示的父节点
/.. 表示父节点
1 | By by = By.xpath("//div[contains(@id,'title:')]/.."); |
最后定位到我们期望的x元素
方法1:
[ ]中括号1表示同级第一个以button为tag的节点,依次类推
1 | By by = By.xpath("//div[contains(@id,'title:')]/../button[1]"); |
方法2:
preceding-sibling - 上一个同级节点
1 | By by = By.xpath("//div[contains(@id,'title:')]/preceding-sibling::button[1]"); |
id已知
先讲难的,再讲简单的,神经病啊!!?? 其实差别不大。
若是id已知,咱们把刚才的html稍微改一下
1 | <td i="header" class="ui-dialog-header"> |
定位方法:二选一
1 | By by = By.xpath("//div[@id='title')]/../button[1]"); |
1 | By by = By.xpath("//div[@id='title')]/preceding-sibling::button[1]"); |
由哥哥节点定位弟弟节点
哥哥定位弟弟 同 弟弟定位哥哥比较相近,咱们把 弟弟定位哥哥 小节的代码稍微改一下, 希望大家可以举一反三,多思考多动手。
1 | <td i="header" class="ui-dialog-header"> |
方法1:
细心的同学可能会发现,其实这里的定位方法与 <弟弟定位哥哥> 完全一样。
1 | By by = By.xpath("//div[@id='title')]/../button[1]"); |
方法2:
和<弟弟定位哥哥> 稍微有点差别
following-sibling - 下一个同级节点
1 | By by = By.xpath("//div[@id='title')]/following-sibling::button[1]"); |
由子节点定位父节点
贴一下html代码 -> test.html
1 | <div class="btn-recharge-c cf">充值父节点 |
已知充值子节点的id=btnRecharge,咱们需要定位父节点
1 | driver = DriverFactory.getDriver(); |
结果都是
充值父节点
由父节点定位子节点
咱们先看代码,test.html
1 | <div class="btn-recharge-c cf" id="father">充值父节点 |
想获取到<充值>节点(或者<充值的弟弟>节点)可以有以下方法:
方法1:
1 | // 先通过id找到父节点,再找到子节点(默认查找最近的一个),再获取属性值value |
方法2:
1 | // 先通过id找到父节点,再找到所有的子节点,取第一个,再获取属性值value |
方法3:
1 | // xpath轴 child 子节点 |
方法4:
1 | // xpath轴 child 子节点 * 通配符 |
方法5:
1 | // css 父子关系查找 |
方法6:
1 | // css nth-child (1)子节点-充值 (2)子节点-充值的弟弟 |
方法7:
1 | // css nth-of-type (1)子节点-充值 (2)子节点-充值的弟弟 |
节点跳跃定位
也不知道这个定位叫法对不对, 哈哈 ,暂且这么叫吧 ~
先看代码,有些不重要的部分已经省略。
1 | <div class="ct-mod-recharge-bd" id="rechargeForm"> |
看一下页面样式, 我们的目的是 <快捷支付><网银支付>这两个元素
我们需要定位到支付方式处,这里没有任何id,name什么的。但是看到最外层div是有一个id的,咱们就用他。
1 | driver.findElement(By.id("rechargeForm")) |
咱们先取到id = rechargeForm的div层,然后再在取到的这层div内查找以li为标签的元素。
因为以li为tag的元素有两个,看情况是取第一个还是第二个。可以看出来,我们并不是以父子定位或者兄弟定位的方式,而是跳跃了几个层级的方式来定位的,代码简化了不少。