Xpath选择、操作web元素

11月6日

xpath选择

XPath（XML Path Language）是W3C（World Wide Web Consortium）定义的用来在XML文档中选择节点的语言，

主浏览器也支持XPath语法（1.X），对于浏览器原生支持XPath的，Selenium尽量使用原生的XPath实现，有些浏览器也支持通过XPath来访问。xpath的语法 看起来非常像电脑文件系统的路径

xpath验证方法     //option

console中                $x('//option')

element tab中

根节点：根节点用 / 表示：对应整个html文档   $x('/')

　　/html -对应html节点

　　/html/body/div 继续选择html下面的一层层节点                                find_elements_by_xpath('/html/body/div')

　　假如路径起始于正斜杠（/）,则此路径始终代表到某元素的绝对路径

　　/ 符号比较像css 中的 > 符号                    直接子元素

//符号的作用

选择整个文档中的所有的option节点，不管什么位置

当前节点 一开始，我们的当前节点就是根节点，通常html  　　　　随后，路径当前部分就是当前节点，比如 /html/body/span

//表示从当前节点寻找所有的后代元素，寻找所有的后代元素，不管它在什么位置

　　如果以//开头就表示从根节点开始，寻找所有的后代元素

　　//div//p 表示选择所有的div元素里面的p元素，不管div在什么位置，不管p元素在div下面的什么位置     $x('//div//p')        <==>            $$('div  p')    ,单斜杠表示直接子节点，双斜杠表示后代

　　//div/p 就等于css选择器的什么写法？      $x('//div/p')         <==>   $$('div >p')   直接子节点

通配符 和css一样，xpath也有通配符 *

　　//div/* 选择div下面所有的元素   等价于css $$('div > *')

根据属性选择

　　//*[@style] 选择所有具有style属性元素             *style

　　//p[@spec='len2'] 选择所有具有spec 值为len2 的元素    注意：css中如果属性值，如果没有空格可以不加引号，但是xpath则必须要引号，单双引号都可以                p[spec='len2']

根据id选择：id、class也是属性    //*[@id="food"]     //div[@id="food"]   //div[@class="cheese"]

子元素选择

选择属于其父元素的第n个某个类型的子元素

　　//p[2]等价于 p:nth-of-type(2)

　　//*[@id="food"]/p[1] 等价于 #food > p:nth-of-type(1)

　　//*2  所有类型的第二个

选择属于其父元素的倒数第n个某个类型的子元素

　　//span[last() -1] 属于其父元素的倒数第二个span              span:nth-last-of-type(2)

　　//*[@id ="food"]/span[last()]

　　//*[last()-1]

选择属于其父元素的第n个子元素（基本所有类型元素）

　　//*[2] 等价于 //*[position()=2] 等价于 *:nth-child(2)

　　//*[@id = "food"]/*[position()=3]

支持其他的比较操作符

　　//*[@id = "food"]/*[position() < 3]             前两个

　　//*[@id = "food"]/*[position() <= 3]           前三个

选择属于其父元素的倒数第n个子元素

　　//*[@id = "food"]/*[last()-1]等价于//*[@id ="food"]/*[position()=last()-1]

　　多选 //*[@id = "food"]/*[position() > last() -3]     后面三个

组选择

用多个表达式一起

css 用，隔开

比如p,button

Xpath用 | 隔开

//p | //button

其他选择语法

参考 http://www.w3school.com.cn/xpath/xpath_axes.asp

相邻兄弟选择器

　　following-sibling  后面的兄弟     css:   #food ~ div 《=》xpath: //*[@id = "food"]/following-sibling::div

#food +div 紧跟着的兄弟

　　preceding-sibling

xpath 擅长的 选择父节点  ..符号，position函数，结合比较操作符

//*[@id = "food"]/..

food = driver.find_element_by_xpath("//*[@id = 'food']")

eles = food.find_elements_by_xpath('.//p)  这里要加一个点，表示当前的food

for ele in eles:

　　print('..........................')

　　print(ele.get_attribute('outerHTML'))

Selenium 作业 4

登录 http://www.51job.com
    点击高级搜索
    输入搜索关键词 python
    地区选择 杭州
    职能类别 选 计算机软件 -> 高级软件工程师
    公司性质选 外资 欧美
    工作年限选 1-3 年

搜索最新发布的职位， 抓取页面信息。 得到如下的格式化信息

    Python开发工程师 | 杭州纳帕科技有限公司 | 杭州 | 0.8-1.6万/月 | 04-27
    Python高级开发工程师 | 中浙信科技咨询有限公司 | 杭州 | 1-1.5万/月 | 04-27

参考答案，往下翻

# coding:utf8
from selenium import webdriver
executable_path = r"d:\tools\webdrivers\chromedriver.exe"

driver = webdriver.Chrome(executable_path)
driver.implicitly_wait(10)

# 打开网址
driver.get('http://www.51job.com')

# 选择高级搜索
driver.find_element_by_css_selector('div.ush > a').click()

# 输入选择关键词
driver.find_element_by_id('kwdselectid').send_keys('python')

# 工作地点选择
driver.find_element_by_id('work_position_input').click()

# 取消 已经选择的
selectedCityEles = driver.find_elements_by_css_selector('#work_position_click_center em[class=on]')

for one in selectedCityEles:
    one.click()

# 选杭州
driver.find_element_by_id('work_position_click_center_right_list_category_000000_080200').click()

# 保存选择
driver.find_element_by_id('work_position_click_bottom_save').click()

# 要点一下别的地方， 否则下面的元素会被挡住
driver.find_element_by_css_selector('div.tit').click()

# 职能类别 选 计算机软件 -> 高级软件工程师

driver.find_element_by_id('funtype_click').click()

driver.find_element_by_id('funtype_click_center_right_list_category_0100_0100').click()

driver.find_element_by_id('funtype_click_center_right_list_sub_category_each_0100_0106').click()

driver.find_element_by_id('funtype_click_bottom_save').click()

# 公司性质选 外资 欧美
driver.find_element_by_id('cottype_list').click()
driver.find_element_by_css_selector('#cottype_list span.li[data-value="01"]').click()

# 工作年限选
driver.find_element_by_id('workyear_list').click()
driver.find_element_by_css_selector('#workyear_list span.li[data-value="02"]').click()

# 点击搜索
driver.find_element_by_css_selector('div.p_sou > span.p_but').click()或者  driver.find_element_by_css_selector("span.p_but[onclick^='kwdGoSearch']").click()

# 结果列表获取内容
jobs = driver.find_elements_by_css_selector('#resultList div[class=el]')

for job in jobs:
    fields = job.find_elements_by_tag_name('span')
    stringFilelds = [field.text for field in fields]
    print (' | '.join(stringFilelds))

driver.quit()