Selenium - 基本元素的操作

了解完元素定位，浏览器操作，接着打算分几篇文章介绍一下一些常见UI控件的操作，比如文本框，按钮，链接，下拉菜单等等。虽然看上去控件的种类很多，但其使用的方法就是那么几个。因为控件不同无非就是html的tag不同，其他的属性都是相同的。方法的介绍很容易从API找到，多说无益。以下就根据UI控件的不同，介绍一下如何运用这些函数完成常用的操作。

文本框：

对于文本框的操作无非就是输入值，清空值，下面是对应的方法。

clear(): 清空文本框的值

send_keys(*value): 模拟按键输入

例子：在主页输入搜索内容，然后清除

driver = webdriver.Firefox()
driver.get('http://www.baidu.com')
search_textbox= driver.find_element_by_id('kw')
search_textbox.send_keys('selenium')
time.sleep(5)
search_textbox.clear()

链接

对于链接的操作一般是点击链接，抑或检查链接的指向

click(): 所有鼠标单击的操作都用这个

get_property(name): 获取[name]这个属性的值

webElement.text: 获取链接显示的字符

例子：获取About Baidu链接的指向，单击链接, 获取链接显示的文本

driver = webdriver.Firefox()
driver.get('http://www.baidu.com')
link = driver.find_element_by_partial_link_text('About')#get link of About Baidu
href = link.get_property('href') #get link href property
print href
print link.text #get link text. It is About  Baidu here
link.click() #click link

多选框

对于多选框，常用的操作就是勾选，取消选择以及检查选择状态

click(): 因为都是用鼠标点击完成，所以勾选与取消选择都用这个函数

is_selected(): 用于检查多选或者单选框是否被选中

例子：这里是检查百度登录界面中‘下次自动登录’的多选框是否被选择。因为偷懒以及为了更好地展示页面的变化这里直接用了很多sleep来进行元素等待的操作，这并不是最优的处理方式。会有专门一篇来讲解元素等待的话题。

driver = webdriver.Firefox()
driver.get('http://www.baidu.com')
time.sleep(3)
logon_link = driver.find_element_by_xpath('//div[@id="u1"]/a[@name="tj_login"]')
logon_link.click()
time.sleep(3)
username_logon_btn = driver.find_element_by_id('TANGRAM__PSP_10__footerULoginBtn')
username_logon_btn.click()
#The above codes are to make username logon dialog appear
time.sleep(3)
auto_logon_checkbox = driver.find_element_by_id('TANGRAM__PSP_10__memberPass')
print auto_logon_checkbox.is_selected() # The checkbox is checked by defualt. It returns True here
auto_logon_checkbox.click() # uncheck the checkbox
print auto_logon_checkbox.is_selected() # Returns False here 

下拉框

下拉框的操作普遍是选择一个选项，获得下拉框中所有选项的值，获得默认选中的项。对于下来框要先看他的实现方式是什么。大多数情况用select tag， 而我自己的项目中的则是通过ul,li来组成的自定义的下拉框。如果你的下拉框也是一个自定义控件，抑或没有使用python，那么可以参考例1来实现所有操作。当然方法一也适用于select控件。如果你使用python且又是标准的select下拉框，那恭喜你，python提供了一个Select类来帮助你很简便地操作它，参考例2。

两个例子都是操作百度首页上搜索设置的“搜索结果显示条数“这个选项进行，html代码就不贴上来了。

例1：

这个例子中没有使用新的元素操作的方法。思路就是先取得下拉框这个对象，然后基于他找到下面所有的option选项。因为default的选项会有selected属性，所以通过xpath很容易找到。打印所有选项就是先找到指定下拉框里所有的选项，然后遍历每一个。而选择某一个选项直接click就可以了，不需要先去下拉下拉框这个动作。（注意：有些实现可能不下拉下拉框下面的选项就 不会加载进来，这种情况下必须先点击下拉框等选项加载进来后再后续操作）

from selenium import webdriver
from selenium.webdriver.common.action_chains import ActionChains
import time

driver = webdriver.Firefox()
driver.get('http://www.baidu.com')
time.sleep(3)
setting_link = driver.find_element_by_xpath('//div[@id="u1"]/a[@name="tj_settingicon"]')
ActionChains(driver).move_to_element(setting_link).perform()
time.sleep(1)
search_setting_link = driver.find_element_by_link_text('搜索设置')
search_setting_link.click()
#The above codes are to open serach setting page.

display_number_dropdown = driver.find_element_by_id('nr') # get drop down element
default_selected_option = display_number_dropdown.find_element_by_xpath('./option[@selected=""]') # Get the default selected option
print ('Default option is %s' % default_selected_option.text) # print default selected option text

#---------------------------------------------------------------------------------
#The below codes are to print all options' text
display_number_options = display_number_dropdown.find_elements_by_tag_name('option')
for option in display_number_options:
    print option.text

#-----------------------------------------------------------------------------------
#The below codes are to select 3rd option
display_number_option3 = display_number_dropdown.find_elements_by_tag_name('option')[2] # Get the third option element
time.sleep(2)
display_number_option3.click() #select the 3rd option

例2

这个例子的思路其实跟例1是完全一样的，只不过Select类提供的函数使得整个代码更加简洁易懂。Select类提供了三种不同的方式去选择选项，这里需要注意的是by value的方法是指option的value属性的值，而不是text。

from selenium import webdriver
from selenium.webdriver.common.action_chains import ActionChains
from selenium.webdriver.support.select import Select
import time

driver = webdriver.Firefox()
driver.get('http://www.baidu.com')
time.sleep(3)
setting_link = driver.find_element_by_xpath('//div[@id="u1"]/a[@name="tj_settingicon"]')
ActionChains(driver).move_to_element(setting_link).perform()
time.sleep(1)
search_setting_link = driver.find_element_by_link_text('搜索设置')
search_setting_link.click()
#The above codes are to open serach setting page.

display_number_dropdown = driver.find_element_by_id('nr') # get drop down element
select_element = Select(display_number_dropdown)
default_selected_option = select_element.first_selected_option # Get the default selected option
print ('Default option is %s' % default_selected_option.text) # print default selectect option text

#---------------------------------------------------------------------------------
#The below codes are to print all options text
display_number_options = select_element.options
for option in display_number_options:
    print option.text

#-----------------------------------------------------------------------------------
#The below codes are to select 3rd option
select_element.select_by_index(2) # select 3rd option
# The following methods work too
# select_element.select_by_value("50")
# select_element.select_by_visible_text("每页显示50条")

单选框

单选框的操作一般是点击选中和检查是否选中的状态。代码其实跟多选框一模一样，因为html的tag都是input。下面快速地举个例子。还是以百度搜索设置里的搜索框提示为例。

from selenium import webdriver
from selenium.webdriver.common.action_chains import ActionChains
import time


driver = webdriver.Firefox()
driver.get('http://www.baidu.com')
time.sleep(3)
setting_link = driver.find_element_by_xpath('//div[@id="u1"]/a[@name="tj_settingicon"]')
ActionChains(driver).move_to_element(setting_link).perform()
time.sleep(1)
search_setting_link = driver.find_element_by_link_text('搜索设置')
search_setting_link.click()
#The above codes are to open serach setting page.

display_radio_button = driver.find_element_by_id('s1_1') # get display radio button
display_label = driver.find_element_by_xpath('//td[@id="se-settting-1"]/label[@for="s1_1"]')
undisplay_radio_button = driver.find_element_by_id('s1_2') # get undisplay radio button
undisplay_label = driver.find_element_by_xpath('//td[@id="se-settting-1"]/label[@for="s1_2"]')

undisplay_radio_button.click()
print undisplay_radio_button.is_selected()
time.sleep(2)
display_radio_button.click()
print display_radio_button.is_selected()

常用的几个控件的操作就介绍到这里了。在写自动化代码前一定要过一遍网页的html，了解每一种控件的实现方式是什么。因为有时候自定义控件并不一定会用标准的html tag，这时候就需要随机应变，融会贯通了。