Selenium之页面元素定位

单个元素定位

WebDriver提供了八种页面元素定位的方法，下面来依次为大家介绍一下：

id定位: find_element_by_id("")

HTML页面规定了id属性在HTML文档中必须是唯一的（页面id不唯一时，在编辑器中会标红显示，但是页面依然能正常加载）。id定位方法就是通过元素的id属性来查找元素，比如通过id定位百度输入框：

<input type="text" class="s_ipt" name="wd" id="kw" maxlength="100" autocomplete="off">
find_element_by_id("kw")

name定位: find_element_by_name("")

HTML页面元素中有时候会指定name属性，有name属性的元素可以通过name进行定位，但要注意name属性在同一个页面可能存在多个相同的元素.

通过name属性定位百度输入框：

<input type="text" class="s_ipt" name="wd" id="kw" maxlength="100" autocomplete="off">
find_element_by_name("wd")

class定位: find_element_by_class_name("")

class定位方式与id、name类似，下面通过class定位百度输入框：

<input type="text" class="s_ipt" name="wd" id="kw" maxlength="100" autocomplete="off">
find_element_by_class_name("s_ipt")

tag定位: find_element_by_tag_name("")

通过html元素的标签类型去定位元素，这个在页面中会存在很多tag name相同的元素，用这种方式识别元素的概率很低。

find_element_by_class_name("input")
find_element_by_class_name("div")

link定位: find_element_by_link_text()

link通常用来定位文本链接，比如百度首页上方的链接就可以通过link的方式定位：

find_element_by_link_text("新闻")
find_element_by_link_text("hao123")
find_element_by_link_text("地图")

partial link定位: driver.find_element_by_link_text()

partial link定位是对link定位的一种补充，有些文本链接会比较长，这个时候可以取文本链接的一部分进行定位，只要这一部分信息可以唯一地标识这个链接。

<a  class="mnav" href="#">一个很长很长很长的文本链接</a>
find_element_by_link_text("一个很长的")
find_element_by_link_text("很长的文本链接")

xpath定位: driver.find_element_by_xpath()

xpath有很多种定位策略，最简单直观的就是写出元素的绝对路径：

• xpath-利用绝对路径定位 如果一个层级下有多个相同的标签名时，那么就按上下顺序确定是第几个，比如div[2]表示当前层级下的第二个div标签。

find_element_by_xpath("/html/body/div/div[2]/div/form/span[2]/input")

• xpath-利用元素属性定位

find_element_by_xpath("//input[@id='kw']")

//表示当前页面某个目录下，imput表示定位元素的标签名，[@id='kw']表示这个元素的id属性值等于kw。下面演示通过name和class定位：

find_element_by_xpath("//input[@name='wd']")
find_element_by_xpath("//input[@class='s_ipt']")
find_element_by_xpath("//*[@class='bg_s_btn']")

如果不想指定标签名，则也可以用星号(*)代替。用xpath不局限与id,name,class等属性，元素的任意属性值都可以使用，只要它能唯一的标识一个元素。

find_element_by_xpath("//input[@maxlength='100']")
find_element_by_xpath("//input[@autocomplete='off']")
find_element_by_xpath("//input[@type='submit']")

• xpath-利用层级和属性结合起来定位

如果一个元素本身没有可以唯一标识这个元素的属性值，那么我们可以往上找其对应的其他层级是否有可以唯一标识属性的值，也可以拿来使用。

find_element_by_xpath("//form[@id='form']/input")
find_element_by_xpath("//form[@id='form']/span[2]/input")

• xpath-使用逻辑运算符连接多个属性值定位

如果一个属性不能唯一地区分一个元素，我们还可以使用逻辑运算符连接多个属性来查找元素。

比如：现在有以下一段元素要定位：

......
<input id="kw" class="su" name="ie">
<input id="kw" class="aa" name="ie">
<input id="bb" class="su" name="ie">
......

此时，要定位第一行的input元素，就可以采用下面的写法：

find_element_by_xpath("//input[@id='kw' and @class='su']")

xpath定位除以上几种方式手写定位外，谷歌浏览器还可以借助浏览器自带的功能进行xpath元素定位的复制，火狐浏览器还可以借助FireBug插件进行元素xpath等方式定位复制。下面演示一下如果在谷歌浏览器上复制百度首页某个元素的xpath路径：

‍1、鼠标选中要定位的元素，右键->选择检查

2、选择屏幕下方高亮的元素，右键->copy->copy xpath / copy full xpath,然后粘贴即可

copy xpath：会根据工具智能的复制出精简的xpath路径， copy full xpath：复制的是全路径的绝对地址定位元素，但这2种方式复制出来的路径并不能保证100%就一定可用，有时候需要自己再进行一些调整。

CSS定位: find_element_by_css_selector(".s_ipt")

css可以比较灵活的选择控件的任意属性，一般情况下定位速度要比xpath快，但对于初学者来说的话，学习起来稍微有点难度，下面就简单地介绍一下css的语法和使用。

css选择器的常见语法

具体用法演示：

1、通过class属性定位
find_element_by_css_selector(".s_ipt")
2、通过id属性定位
find_element_by_css_selector("#kw")
3、通过标签定位
find_element_by_css_selector("input")
4、通过父子关系定位
find_element_by_css_selector("span>input")
5、通过属性定位
find_element_by_css_selector("[autocomplete=off]")
find_element_by_css_selector("[name=kw]")
6、组合定位
find_element_by_css_selector("form.fm>span>input.s_ipt")
find_element_by_css_selector("form#form>span>input#kw")

以上简单的介绍了8中定位方法，WebDriver还提供了另外一套写法，即统一调用find_element()方法，通过By来声明定位的方法，并且传入对应定位方法的定位参数。具体如下：

• find_element(By.ID,"loginName")
• find_element(By.NAME,"SubjectName")
• find_element(By.CLASS_NAME,"u-btn-levred")
• find_element(By.TAG_NAME,"input")
• find_element(By.LINK_TEXT,"退出")
• find_element(By.PARTIAL_LINK_TEXT,"退")
• find_element(By.XPATH,"//*[@id='Title']")
• find_element(By.CSS_SELECTOR,"[type=submit]")

其实前面8中定位方法，底层也是调用的find_element()方法：

    def find_element_by_id(self, id_):
        """Finds an element by id.

        :Args:
         - id\_ - The id of the element to be found.

        :Returns:
         - WebElement - the element if it was found

        :Raises:
         - NoSuchElementException - if the element wasn't found

        :Usage:
            element = driver.find_element_by_id('foo')
        """
        return self.find_element(by=By.ID, value=id_)

find_element(),find_elements()区别

细心的同学会发现，在使用的时候，除了find_element()之外，还会有一个find_elements()方法，那么他们两有什么区别呢？

1.只查找一个元素的时候:可以使用find_element(),find_elements()

find_element()会返回一个WebElement节点对象,但是没找到会报错,而find_elements()不会,之后返回一个空列表

2.查找多个元素的时候:只能用find_elements(),返回一个列表,列表里的元素全是WebElement节点对象

3.如果想要获取元素相关内容，find_element()可直接获取，find_elements()需要获取列表某个指定元素之后才能获取相关内容

一组元素定位

前面已经介绍了单个元素定位的方法，这里再介绍一种定位一组元素的方法：

find_elements_by_id()

find_elements_by_name()

find_elements_by_class_name()

find_elements_by_tag_name()

find_elements_by_link_text()

find_elements_by_partial_link_text()

find_elements_by_xpath()

find_elements_by_css_selector()

看出区别了吗？这几个方法在element后面加了一个s，能够定位多个属性相同的元素，返回的是一个元素对象的数组，定位不到时，返回的是一个空数组，不会报元素找不到的异常。

应用场景：比如下拉框的时候 ，先定位获取下拉框的所有选项，再循环遍历，找到满足条件的某个元素，选中或者做其他操作。