一，定位原则
- 稳定
- 简单灵活
- 唯一
WebDriver提供了两种方式来定位页面元素，分别是find_element_by_XXX和find_elements_by_XXX。第一种方式的结果是在正常情况下返回一个页面元素的对象，一旦出现异常就会报错。第二种方式的结果是在正常情况下返回页面元素的多个对象，如果没有任何一个DOM元素能匹配，则此返回列表为空。
二，8大元素定位方法
id name classname tagName（前4个是通过CSS Seletor原理） link_text partial_link_text Css xpath
优先使用id,name,classname,tagename唯一定位
- find_elemet_by_id("id属性值") # 参数少，直观 VS find_element(by=By.ID, value='kw')
- find_element_by_name("name属性值")
- find_elemnt_by_classname("class属性值")
- find_element_by_tagname("tag标签")
- find_element_by_link_text(" ")
- find_element_by_partial_link_text(" ")
- find_element_by_css_selector()
- find_element_by_xpath()
还有一种是find_element(by=By.ID, value="id")，其实查看find_element_by_id()的源码，可以看到该方法其实是调用find_element()方法。
三，css vs xpath
- CSS对于简单的定位更加简介；
- CSS对于主流浏览器，效率更高；
- 对于复杂的定位，使用xpath更简洁；
- xpath基本上都能定位的到，功能更强大
四，xpath定位
1.xpath基本概念和语法（https://www.runoob.com/xpath/xpath-syntax.html）
节点名
- 非常广泛
从根节点开始选取，根节点是 /
- 绝对路径
- 路径很长，需要从根节点开始一级一级往下写，例如/html/head/title
- 从根节点开始往下查找，直到找到所有符合要求的节点
相对路径
- //是相对路径，会找出所有这个元素，然后再根据具体的元素属性定位一个
- 例如，//h2/a
选取当前节点
- 一个点指获取当前节点是 /.
- 两个点指选取上一级节点 /..，即父节点
- //是指从全文上下文中搜索//后面的节点，而.//则是指从前面的节点的子节点中进行查找
使用@选取属性
- 标签名[@属性名=“属性值”]
- 例如，//span[@class="js-label"]
- //a[@class]将所有带有class属性的a标签返回
contains包含关系
- 例如，//a[contains(@name,'trnews')]
使用text文本text()
- 例如，//span[contains(text(), "java测试")]
- //span[text()=" java测试"]（精准匹配）
多条件定位
- 当某个属性不足以唯一区别某一个元素时，可以采取多个条件组合的方式
- and（与）
- 例如，//input[@name and @class="s_ipt"]
- or（或）
- 例如，//input[@id="kw" or @id="su"]
层级定位
- 子标签不唯一，但父标签唯一，可以协助父标签一起定位
- 例如，//a[@title="Python"]/span[@class="js-label"]
通配符定位节点
- 例如，//*匹配所有节点
- 例如，//*[@id="su"]
- 匹配所有拥有属性节点的元素//*[@*]
轴定位（能够找到一个唯一的中心点）（参考文档：https://www.w3school.com.cn/xpath/xpath_axes.asp）
- 应用场景：当某个元素的各个属性及其组合都不足以定位时，可以利用其兄弟节点或者父节点等各种可以定位的元素进行定位。
- parent 父节点名
- ancestor 祖先节点，包含父节点
- preceding 当前元素节点之前的所有节点
- preceding-sibling 当前节点之前的兄弟节点（哥哥）
- following 当前节点结束标签之后的所有节点（儿子）
- following-sibiling 当前节点结束标签之后的兄弟节点，而不包含其他子节点（弟弟）
- 例如，//dd[@data="1992"]/following-sibling::dd[contains[@class, "batscore"]]/span
按照位置索引获取节点，获取同一个节点下面的所有同类型的子节点
- 从1开始，最后一个是last()
- //div[@data-report-module="middle-course"]/ul/li[1]
- //div[@data-report-module="middle-course"]/ul/li[last()]
- //div[@data-report-module="middle-course"]/ul/li[last()-1]
- //div[@data-report-module="middle-course"]/ul/li[position()>4]
五，CSS定位（参考文档：https://www.cnblogs.com/longronglang/p/9144661.html）
1，常见符号
- #表示 id选择器
- .表示 class选择器
- >表示子元素，层级
- 一个空格也表示子元素，但是是所有的后代子元素，相当于 xpath 中的相对路径
2，属性定位
百度输入框的的html代码，<input id="kw" class="s_ipt" type="text" autocomplete="off" maxlength="100" name="wd"/>
- css可以通过元素的id、class、标签这三个常规属性直接定位到
- css用#号表示id属性,如：#kw
- css用.表示class属性，如：.s_ipt
- css直接用标签名称，无任何标示符，如：input
3，其他属性
1.css除了可以通过标签、class、id这三个常规属性定位外，也可以通过其它属性定位
2.以下是定位其它属性的格式
[name=wd] [autocomplete='off'][maxlength='255']
4，标签
css页可以通过标签与属性的组合来定位元素
input.s_ipt
input#kw
input[id='kw']
5，层级关系
//form的id属性
form#form>span>input
//form的class属性
form.fm>span>input
6，索引
css也可以通过索引nth-child(1)来定位子元素，直接翻译过来就是第几个小孩
总结：选择标签后，找第几个小孩即可
Select控件第三个Opel
#select>select>option:nth-child(3)
CheckBox第一个Volvo
#checkbox>input:nth-child(1)
7，逻辑运算
css同样也可以实现逻辑运算，同时匹配两个属性，这里跟xpath不一样，无需写and关键字
[type='checkbox'][name='checkbox1']
css语法远远不止上面提到的，还有更多更强大定位策略，有兴趣的同学可以继续深入研究