Python3.x：Selenium中的webdriver进行页面元素定位

Python3.x：Selenium中的webdriver进行页面元素定位

页面上的元素就像人一样，有各种属性，比如元素名字，元素id，元素属性（class属性，name属性）等等。webdriver就是利用元素的这些属性来进行定位的。

可以用于定位的常用的元素属性：

• id
• name
• class name
• tag name
• link text
• partial link text
• xpath
• css selector

对应于webdriver中的定位一个元素方法分别是：

• driver.find_element_by_name() 
• driver.find_element_by_id() 
• driver.find_element_by_class_name()
• driver.find_element_by_tag_name() 
• driver.find_element_by_link_text() 
• driver.find_element_by_partial_link_text() 
• driver.find_element_by_xpath() 
• driver.find_element_by_css_selector()

相应的webdriver中的 定位一组元素的方法：

• driver.find_elements_by_name()
• driver.find_elements_by_id()
• driver.find_elements_by_class_name()
• driver.find_elements_by_tag_name()
• driver.find_elements_by_link_text()
• driver.find_elements_by_partial_link_text()
• driver.find_elements_by_xpath()
• driver.find_elements_by_css_selector()

使用示例：

• id 和name 定位

  #id 
  driver.find_element_by_id('kw')  
  #name
  driver.find_element_by_name('tj_trnews')  

• class name和tag name定位

    #class name
    driver.find_element_by_class_name("s_ipt")  
  　#span 元素，其中class="bg s_ipt_wr quickdelete-wrap"，
  　#注意一下其中的空格，空格在这里的作用是分割多个类名的。这个 class 属性有两个空格，那么的代表这个 class 属性中包含了 3 个类名。
    #<span id="s_kw_wrap" class="bg s_ipt_wr quickdelete-wrap"></span>
    #使用 WebDriver 中的 class_name 定位方式的话，就只能使用其中一个。
  　driver.find_element_by_class_name("bg")
    或者
    driver.find_element_by_class_name("s_ipt_wr")
    或者
    driver.find_element_by_class_name("quickdelete-wrap")
  
    #tag name
    driver.find_element_by_tag_name('table')

• link text 与partial link text 定位

  #通过linx text定位
  find_element_by_link_text("新闻")  
  find_element_by_link_text("贴吧")  
  #通过partail link text定位
  find_element_by_link_text("新")  
  find_element_by_link_text("贴")  

• XPath 定位（插件XPath Checker，Firefox的附件组件，可以直接右键查看元素的XPath。）

  '''
  XPath是一种文档定位语言。因为HTML可以看做是XML的一种实现，所以selenium用户可使用这种强大的语言在web应用中定位。
  绝对路径方法：
  从根元素写起，当元素层级很深的时候，路径写的会很长，阅读性不好，也很难维护。不建议使绝对路径这样的方法。
  相对路径方法：
  通过Firebug很容易得到相对路径的xpath，打开Firebug插件，在页面上的搜索文本框，就可以显示出xpath了；
  常用规则
    nodename    选取此节点的所有子节点
    /     从当前节点选取直接子节点
    //    从当前节点选取子孙节点
    .      选取当前节点
    ..     选取当前节点的父节点
    @    选取属性
  '''
  
  #通过xpath寻找，任意（*代表）id属性为’kw‘的元素
  driver.find_element_by_xpath("//*[@id='kw']").click() 
  #通过xpath寻找，任意（*代表）input属性为’kw‘的元素
  driver.find_element_by_xpath("//input[@id='kw']").click()  
  
  #需要根据上级目录的属性来定位当前元素
  #通过上一级目录的id 属性定位  
  find_element_by_xpath("//span[@id=’input-container’]/input") 
  #通过上三级目录的id 属性定位  
  find_element_by_xpath("//div[@id=’hd’]/form/span/input") 
  #通过上三级目录的name 属性定位 
  find_element_by_xpath("//div[@name=’q’]/form/span/input")
  
  from lxml import etree
  html = etree.parse('test.html',etree.HTMLParser())
  re = etree.tostring(html)
  
  #子节点选取
  result1 = html.xpath('//*') #选取所有节点
  result = html.xpath('//li') #选取所有li子孙节
  result2 = html.xpath('//li/a') #选取li节点的直接a直接点
  #文本获取和属性获取
  result1 = html.xpath('//a[@href="link4.html"]') #属性匹配
  result2 = html.xpath('//a[@href="link4.html"]/../@class') #父节点
  result3 = html.xpath('//a[@href="link4.html"]/text()') #文本获取
  result4 = html.xpath('//a/@href') #属性获取 注意区别与属性匹配
  #属性多只匹配
  result1 = html.xpath('//li[@class="li"]/a/text()') #匹配失败
  result2 = html.xpath('//li[@class="li li-first"]/a/text()') #匹配正确
  result3 = html.xpath('//li[contains(@class,"li")]/a/text()') #利用contains()函数进行属性多值匹配
  result4 = html.xpath('//li[contains(@class,"li") and @name = "item"]/a/text()') #多属性匹配
  #按序选择
  result1 = html.xpath('//li[1]/a/text()')
  result2 = html.xpath('//li[last()]/a/text()')
  result3 = html.xpath('//li[position()<3]/a/text()')
  #节点轴选择
  result1 = html.xpath('//li[1]/ancestor::*') #调用ancestor轴，获取所有祖先节点
  result2 = html.xpath('//li[1]/ancestor::div') #调用ancestor轴，限定获取div祖先节点
  result3 = html.xpath('//li[1]/attribute::*') #调用attribute轴，获取所有属性值
  result4 = html.xpath('//li[1]/child::a[@href="link1.html"]') #调用child轴并限定条件(这里加不加限定条件一样，只有一个子节点)
  result5 = html.xpath('//li[1]/descendant::span') #调用descendant轴，获取子孙节点并限定条件
  result6 = html.xpath('//li[1]/following::*') #调用following轴，获取当前节点后的所有节点并限定索引
  result7 = html.xpath('//li[1]/following::*[2]') #调用following轴，获取当前节点后的所有节点并限定索引
  result8 = html.xpath('//li[1]/following-sibling::*') #调用following-sibling轴，获取当前节点之后的所有同级节点
  #多值匹配
  xpath('//div[contains(@class,"a") and contains(@class,"b")]') #它会取class含有有a和b的元素
  xpath('//div[contains(@class,"a") or contains(@class,"b")]') #它会取class 含有 a 或者 b满足时，或者同时满足时的元素

• CSS定位

  #这种定位方法是比较难理解

 获取元素后，解析元素的源码、属性值、文本内容：

#返回一个object
data = driver.find_elements_by_tag_name('table')[0]
#返回html源码
dataHtml = data.get_attribute('innerHTML')
#返回ID值
dataId = data.get_attribute('id')
#返回文本内容
dataText = data.text