使用浏览器开发工具查看web元素

打开浏览器，访问网站，然后按 F12 。
image.png

根据 元素的id选择元素

根据规范，如果元素有id属性，这个id必须是当前HTML中唯一的。
所以，如果元素有id，根据id选择元素是最简单高效的方式。

  1. # 根据id选择元素，返回该元素对应的WebElement对象
  2. element = wd.find_element_by_id('kw')

根据 class属性、tag名 选择元素

元素也有类型，class属性就是用来标志着元素类型。
以该测试网站为例：http://cdn1.python3.vip/files/selenium/sample1.html
对应的html内容，有以下部分：
image.png
所有的植物元素都有个class属性-值为plant；
所有的动物元素都有个class属性-值为animal。

如果选择所有的动物，可以使用方法 find_elements_by_class_name 。

  1. wd.find_elements_by_class_name('animal')

find_elements_by_class_name 方法返回的是找到的符合条件的 所有 元素 (这里有3个元素)， 放在一个 列表 中返回。
而如果我们使用 find_element_by_class_name (注意少了一个s) 方法， 就只会返回 第一个 元素。

  1. from selenium import webdriver
  3. # 创建 WebDriver 实例对象，指明使用chrome浏览器驱动
  4. wd = webdriver.Chrome(r'd:\webdrivers\chromedriver.exe')
  6. # WebDriver 实例对象的get方法 可以让浏览器打开指定网址
  7. wd.get('http://cdn1.python3.vip/files/selenium/sample1.html')
  9. # 根据 class name 选择元素，返回的是 一个列表
  10. # 里面 都是class 属性值为 animal的元素对应的 WebElement对象
  11. elements = wd.find_elements_by_class_name('animal')
  13. # 取出列表中的每个 WebElement对象，打印出其text属性的值
  14. # text属性就是该 WebElement对象对应的元素在网页中的文本内容
  15. for element in elements:
  16.     print(element.text)

通过 WebElement 对象的 text属性 可以获取该元素 在网页中的文本内容。

  1. print(element.text)

通过WebElement对象选择元素

  • WebDriver 对象选择元素的范围是整个web页面；
  • WebElement对象选择元素的范围是该元素的内部。
  1. from selenium import webdriver
  3. #  创建webdriver对象并指明使用chrome浏览器驱动
  4. #  r表示原生字符串，不存在转义
  5. wd = webdriver.Chrome(r'd:\chromedriver.exe')
  7. #  调用webdriver对象的get方法， 可以让浏览器打开指定的网址
  8. # wd.get('http://www.baidu.com')
  9. wd.get('http://cdn1.python3.vip/files/selenium/sample1.html')
  11. elements = wd.find_element_by_id('container')
  13. spans = elements.find_elements_by_tag_name('span')
  14. for span in spans:
  15.     print(span.text)

image.png