转：Selenium之CSS Selector定位详解
CSS selector定位
CSS(Cascading Style Sheets)是一种语言，它被用来描述 HTML 和 XML 文档的样式。
百度输入框：
<input name="wd" id="kw1" style="width: 489px;" type="text" maxLength="100"autocomplete="off" jQuery110203956990375154798="25"/>
“百度一下”按钮
<input class="btn self-btn" id="su1" onmouseout="this.className='btn'"
onmousedown="this.className='btn btn_h'" type="submit" value="百度一下"/>
Type selector
语法： E
语义： E元素
示例：
# coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Ie()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get("http://www.baidu.com/")
#百度输入框 Type selector 定位（ E）
search_ipt = driver.find_element_by_css_selector('input')
search_ipt.send_keys(u'授客')
driver.find_element_by_id('su1').click()
time.sleep(3)
driver.quit()
注意：改成火狐驱动运行上述代码，运行不通过
child Combinator selector
语法： E>F
语义： E元素的一个子元素F
driver.find_element_by_css_selector("body>form>a")
ID selector
语法： E#myid
语义： ID值等同myid的元素E
示例：
# coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Ie()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get("http://www.baidu.com/")
#百度输入框 ID selector 定位(E#element_id)
search_ipt = driver.find_element_by_css_selector('input#kw1')
search_ipt.send_keys(u'授客')
driver.find_element_by_id('su1').click()
time.sleep(3)
driver.quit()
说明:似乎不加E元素也行driver.find_element_by_css_selector("#kw1")
Attribute selector
语法： E[attribute]
语义：带有一个attribute属性的元素E
示例：
# coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Ie()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get("http://www.baidu.com/")
#百度输入框 Attribute selector定位(E[attribute])
search_ipt = driver.find_element_by_css_selector('input[name]')
search_ipt.send_keys(u'授客')
driver.find_element_by_id('su1').click()
time.sleep(3)
driver.quit()
语法： E[attribute="value1"]
语义：带有一个attribute属性，且属性值恰好等于value1的元素E
示例：
# coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Ie()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get("http://www.baidu.com/")
#百度输入框 Attribute selector定位(E[attribute])
search_ipt =driver.find_element_by_css_selector('input[name="wd"]')
search_ipt.send_keys(u'授客')
driver.find_element_by_id('su1').click()
time.sleep(3)
driver.quit()
语法： E[attribute~="value1"]
语义：带有一个attribute属性，且属性值是有由多个空格隔开，其中一个值恰好等于value1
的元素E
driver.find_element_by_css_selector("input[class~='btn']")
示例：
# coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Ie()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get("http://www.baidu.com/")
search_ipt =driver.driver.find_element_by_id('kw1')
search_ipt.send_keys(u'授客')
#“百度一下”按钮Attribute selector定位(E[attribute~="value1"])
driver.find_element_by_css_selector('input[class~="btn"]').cli
ck()
time.sleep(3)
driver.quit()
语法： E[attribute^="value1"]
语义： 带有一个attribute属性，且属性值以字符串“ value1”开头的元素E
示例：
# coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Ie()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get("http://www.baidu.com/")
search_ipt =driver.driver.find_element_by_id('kw1')
search_ipt.send_keys(u'授客')
#“百度一下”按钮Attribute selector定位(E[attribute^="value1"])
driver.find_element_by_css_selector('input[class^="btn"]').cli
ck()
time.sleep(3)
driver.quit()
语法： E[attribute$="value1"]
语义： 带有一个attribute属性，且属性值恰好以字符串“ value1”结尾的元素E
示例：
# coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Ie()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get("http://www.baidu.com/")
search_ipt =driver.driver.find_element_by_id('kw1')
search_ipt.send_keys(u'授客')
#“百度一下”按钮Attribute selector定位(E[attribute$="value1"]))
driver.find_element_by_css_selector('input[class$="btn"]').cli
ck()
time.sleep(3)
driver.quit()
语法： E[attribute*="value1"]
语义： 带有一个attribute属性，且属性值包含字符串“ value1“的元素E
示例：
# coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Ie()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get("http://www.baidu.com/")
search_ipt =driver.driver.find_element_by_id('kw1')
search_ipt.send_keys(u'授客')
#“百度一下”按钮Attribute selector定位(E[attribute*="value1"])
driver.find_element_by_css_selector('input[class*="btn"]').cli
ck()
time.sleep(3)
driver.quit()
有道搜索按钮：
<input class="s-btn" id="qb" type="submit" value="搜 索"/>
<input class="s-btn" id="qb" type="submit" value="搜 索"/>
语法： E[attribute|="value1"]
语义： 匹配任何属性值以"-"作为分隔符，而且被分割的第一个部分精确等于"value1"的E
元素（也匹配属性只有属性值value1的元素）
示例：
# coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Ie()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get("http://www.youdao.com/")
#有道搜索输入框Attribute selector定位(E[attribute|="value1"])
search_ipt =
driver.find_element_by_css_selector('input[class|="s"]')
search_ipt.send_keys(u'授客')
driver.find_element_by_id('qb').click()
time.sleep(3)
driver.quit()
Structural pseudo-classes(结构伪类) selector
有道输入框及“ 搜索”按钮
语法： E:nth-child(n)
语义：父元素的第n个子元素： E
注意： 所有主流浏览器均支持类似:nth-child() 选择器，但IE8及更低版本都不支持，其
它主流浏览器，比如火狐支持
示例：
#coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Firefox()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get('http://www.youdao.com/')
div_em = driver.find_element_by_id('x')#定位父级元素
#有道输入框structural pseudo-classes selector定位(E:nth-child(n))
search_ipt
=div_em.find_element_by_css_selector('div:nth-child(2)>form>sp
an>input')
search_ipt.send_keys(u'授客')
driver.find_element_by_id('qb').click()
time.sleep(3)
driver.quit()
语法： E:nth-last-child(n)
语义：父元素的倒数第n个子元素： E
注意：实际写法类似这样： n=–n+倒数， n=-2n+倒数
示例：
#coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Firefox()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get('http://www.youdao.com/')
div_em = driver.find_element_by_id('x')#定位父级元素
#有道输入框structural pseudo-classes selector定位
(E:nth-last-child(n))
search_ipt
=div_em.find_element_by_css_selector('div:nth-last-child(n-5)>fo
rm>span>input')
search_ipt.send_keys(u'授客')
driver.find_element_by_id('qb').click()
time.sleep(3)
driver.quit()
语法： E:nth-of-type(n)
语义：父元素的子元素中，与元素E同类型的第n个元素
示例：
#coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Firefox()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get('http://www.youdao.com/')
div_em = driver.find_element_by_id('x')#定位父级元素
#有道输入框structural pseudo-classes selector定位
(E:nth-of-type(n))
search_ipt
=div_em.find_element_by_css_selector('div:nth-of-type(2)>form>
span>input')
search_ipt.send_keys(u'授客')
driver.find_element_by_id('qb').click()
time.sleep(3)
driver.quit()
语法： E:nth-last-of-type(n)
语义：父元素的子元素中，与元素E同类型的第n个元素,从倒数算起
示例：
#coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Firefox()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get('http://www.youdao.com/')
div_em = driver.find_element_by_id('x')#定位父级元素
#有道输入框structural pseudo-classes selector定位
(E:nth-last-of-type(n))
search_ipt =div_em.
div_em.find_element_by_css_selector('div:nth-last-of-type(n-1)
>form>span>input')
search_ipt.send_keys(u'授客')
driver.find_element_by_id('qb').click()
time.sleep(3)
driver.quit()
语法： E:first-child
语义：父元素的第一个子元素： E
示例：
#coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Firefox()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get('http://www.youdao.com/')
div_em = driver.find_element_by_id('fm')#定位父级元素
#有道输入框structural pseudo-classes selector定位(E:first-child)
search_ipt =div_em.
div_em.find_element_by_css_selector('div:first-child>form>span
>input')
search_ipt.send_keys(u'授客')
driver.find_element_by_id('qb').click()
time.sleep(3)
driver.quit()
语法： E:last-child
语义：父元素的最后一个子元素： E
示例：
#coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Firefox()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get('http://www.youdao.com/')
div_em = driver.find_element_by_id('x')#定位父级元素
#有道输入框structural pseudo-classes selector定位(E:last-child)
search_ipt =div_em.
div_em.find_element_by_css_selector('div:last-child>form>span>
input')
search_ipt.send_keys(u'授客')
driver.find_element_by_id('qb').click()
time.sleep(3)
driver.quit()
语法： E:first-of-type
语义：父元素的父元素的子元素中，第一个类型与E元素相同的子元素
示例：
#coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Firefox()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get('http://www.youdao.com/')
div_em = driver.find_element_by_id('fm')#定位父级元素
#有道输入框structural pseudo-classes selector定位(E:first-of-type)
search_ipt =div_em.
div_em.find_element_by_css_selector('form>span:first-of-type>i
nput')
search_ipt.send_keys(u'授客')
driver.find_element_by_id('qb').click()
time.sleep(3)
driver.quit()
语法： E:last-of-type
语义：父元素的父元素的子元素中，最后一个类型与E元素相同的子元素
示例：
#coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Firefox()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get('http://www.youdao.com/')
div_em = driver.find_element_by_id('x')#定位父级元素
#有道输入框structural pseudo-classes selector定位(E:last-of-type)
search_ipt =div_em.
div_em.find_element_by_css_selector('div:last-of-type>form>spa
n>input')
search_ipt.send_keys(u'授客')
driver.find_element_by_id('qb').click()
time.sleep(3)
driver.quit()
语法： E:only-child
语义：父元素唯一的子元素
示例：
#coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Firefox()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get('http://www.youdao.com/')
div_em = driver.find_element_by_id('fm')#定位父级元素
#有道输入框structural pseudo-classes selector定位(E:only-child)
search_ipt =div_em.
div_em.find_element_by_css_selector(':only-child>span>input')
search_ipt.send_keys(u'授客')
driver.find_element_by_id('qb').click()
time.sleep(3)
driver.quit()
注意：
div_em.find_element_by_css_selector('form:only-child>span>input')
这样也行
语法： E:only-of-type
语义：父元素子元素中，类型与给定元素E相同的唯一子元素
示例：
#coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Firefox()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get('http://www.youdao.com/')
div_em = driver.find_element_by_id('fm')#定位父级元素
#有道输入框structural pseudo-classes selector定位(E:only-of-type)
search_ipt =div_em.
div_em.find_element_by_css_selector('form:only-of-type>span>input')
search_ipt.send_keys(u'授客')
driver.find_element_by_id('qb').click()
time.sleep(3)
driver.quit()
语法： E:empty
语义：没有子元素的元素E
示例：
#coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Firefox()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get('http://www.youdao.com/')
div_em = driver.find_element_by_id('fm')#定位父级元素
#有道输入框structural pseudo-classes selector定位(E:only-of-type)
search_ipt =div_em.
div_em.find_element_by_css_selector('form>span>input:empty')
search_ipt.send_keys(u'授客')
driver.find_element_by_id('qb').click()
time.sleep(3)
driver.quit()
百度页面连接
link pseudo-classes selector
语法： E:link
语义： 还未被访问的超链接元素E
示例：
#coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Firefox()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get('http://www.baidu.com/')
div_em = driver.find_element_by_id('u1')#定位父级元素
#百度页面，新闻连接link pseudo-classes selector定位(E:link)
news_link =div_em.find_element_by_css_selector('a:link')
news_link.click()
time.sleep(3)
driver.quit()
link pseudo-classes selector
语法： E:visited
语义： 已经访问的超链接元素E
the user action pseudo-classes selector
语法： E:hover
语义： 选择鼠标指针浮动在其上的元素
示例：
#coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Firefox()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get('http://www.baidu.com/')
div_em = driver.find_element_by_id('u1')#定位父级元素
#百度页面link pseudo-classes selector定位(E:hao123)
hao123_link =div_em.find_element_by_css_selector('a:hover')
hao123_link.click()
time.sleep(3)
driver.quit()
说明： ：打开页面后把鼠标光标移动到对应的连接上方，自动点击对应元素
the user action pseudo-classes selector
语法： E:focus
语义：选择鼠标光标所在输入框元素
示例：
#百度输入框定位user action pseudo-classes selector定位(E:focus)
示例：
#coding= utf-8
from selenium import webdriver
import time
if __name__ == "__main__":
driver = webdriver.Firefox()
driver.implicitly_wait(5)
driver.maximize_window()
driver.get('http://www.baidu.com/')
div_em = driver.find_element_by_id('u1')#定位父级元素
#百度页面link pseudo-classes selector定位(E:focus)
search_ipt =div_em.find_element_by_css_selector('a:focus)
#说明：打开页面后把鼠标点击搜索框，会定位到该输入框
search_ipt.send_keys(u'授客')
driver.find_element_by_id('su1').click()
time.sleep(3)
driver.quit()
UI element states pseudo-classes selector
语法： E:enabled
语义： 选择状态为enabled的元素
语法： E:disabled
语义：选择状态为disabled的元素(通常是灰色，点击无反应的元素)
示例：
#coding= utf-8
from selenium import webdriver
import time
import os
if __name__ == '__main__':
driver = webdriver.Firefox()
file_path = os.path.abspath('disabled.html')
driver.get(file_path)
driver.implicitly_wait(5)
#账户输入框定位UI elementstates pseudo-classes selector定位(E:disabled)
driver.find_element_by_css_selector('body>form>input:disabled').click()
#密码输入框定位UI element states pseudo-classes selector定位(E:enabled)
driver.find_element_by_css_selector('body>form>input:enabled').send
_keys("test")
time.sleep(3)
driver.quit()
注意：
1.记得把disabled.html放到src目录下
2.一次仅定位一个输入框，也就是说前面的已经定位到了某个输入框，那么后面的输入框不
再被定位
语法： E:checked
语义：选择状态为checked的元素(通常是灰色，点击无反应的元素)
示例：
# coding= utf-8
from selenium import webdriver
import time
import os
if __name__ == '__main__':
driver = webdriver.Firefox()
driver.maximize_window()
file_path = os.path.abspath('checked.html')
driver.get(file_path)
time.sleep(2)
#复选框定位element stats pseudo-classes selector定位(E:checked)
driver.find_element_by_css_selector('body>form>input:checked')
.click()
time.sleep(3)
driver.quit()
注意：记得把checked.html放到src目录下
Negation pseudo-selector
语法： E:not(s)
语义：选择与选择器(selector)： s,不匹配的元素E
示例：
# coding= utf-8
from selenium import webdriver
import time
import os
if __name__ == '__main__':
driver = webdriver.Firefox()
driver.maximize_window()
file_path = os.path.abspath('checked.html')
driver.get(file_path)
time.sleep(2)
#百度超链接定位Negation pseudo-class selector定位(E:not(s))
driver.find_element_by_css_selector('body>form>a:not(input)').
click()
time.sleep(3)
driver.quit()
注意：记得把checked.html放到src目录下
driver.find_element_by_css_selector('body>form>a:not(input)')
Descendant combinator selector
语法： E F
语义： E元素的一个派生子元素F(子元素，及子元素的子元素……，即父元素>派生子元素>
派生子子元素……)
示例：
# coding= utf-8
from selenium import webdriver
import time
import os
if __name__ == '__main__':
driver = webdriver.Firefox()
file_path = os.path.abspath('checked.html')
driver.get(file_path)
driver.maximize_window()
time.sleep(3)
#百度超链接定位Descendant combinator定位(E F)
driver.find_element_by_css_selector('body>form a').click()
time.sleep(3)
driver.quit()
注意：
2.记得把checked.html放到src目录下
2.和E>F的区别， E>F 如果F是E元素下的第一个类型与F相同的子元素则不必指定序号，否
则要用类似nth-child(n)之类的指定，而E F不管是否指定序号，都可以，
转：Selenium之CSS Selector定位详解的更多相关文章
- selenium之css selector定位
什么是CSS Selector? Css Selector定位实际就是HTML的Css选择器的标签定位 工具 Css Selector的练习建议大家安装火狐浏览器(49及以下版本)后,下载插件Fire ...
- CSS各种定位详解
1.定位的专业解释 (1)语法 position:static|absolute|fixed|relative (2)说明 从上面语法可以看出,定位的方法有很多种,它们分别是静态(static),绝对 ...
- Css选择器定位详解
1.使用 class 属性来定位元素,方法如下: driver.findElement(By.cssSelector("input.login")); 即可以先指定一个 HTML的 ...
- css position定位详解
position:static 默认方式: position:relative 相对定位,相对于原有位置进行移动,并且保留它在文件流中的占位: position:absolute 绝对定位,相对于最近 ...
- selenium：css_selector定位详解（css selector和xpath的比较）
selenium使用css selector和xpath的比较 selenium提供的定位方式(常用) ID NAME CLASS CSS SELECTOR XPATH 推荐的定位方式的优先级 优 ...
- selenium：css_selector定位详解
selenium:css_selector定位详解(css selector和xpath的比较) 来源:https://www.cnblogs.com/haifeima/p/10138154.html ...
- 带你走进CSS定位详解
学习CSS相关知识,定位是其中的重点,也是难点之一,如果不了解css定位有时候都不知道怎么用,下面整理了一下关于定位属性的具体理解和应用方案. 一:定位 定位属性列表 position top bot ...
- CSS进阶内容—浮动和定位详解
CSS进阶内容-浮动和定位详解 我们在学习了CSS的基本知识和盒子之后,就该了解一下网页的整体构成了 当然如果没有学习之前的知识,可以到我的主页中查看之前的文章:秋落雨微凉 - 博客园 CSS的三种布 ...
- Selenium 使用css selector (资源来源于网络)
Selenium - CSS Selector 昨天我练习了用CSS(即层叠样式表Cascading Stylesheet) Selector来定位(locate)页面上的元素(Elements).S ...
随机推荐
- 特征向量-Eigenvalues_and_eigenvectors#Graphs
https://en.wikipedia.org/wiki/Eigenvalues_and_eigenvectors#Graphs A {\displaystyle A} ...
- [转]C++ string的trim, split方法
很多其他语言的libary都会有去除string类的首尾空格的库函数,但是标准C++的库却不提供这个功能.但是C++string也提供很强大的功能,实现trim这种功能也不难.下面是几种方法: 1.使 ...
- 我的第一个chrome扩展（0）——目标
当前有两个方向: 一.实现一个自动解码的地址栏监视器 扩展程序在后台不断监视地址栏输入,地址栏输入并回车后检查输入,若输入符合解码条件则调用网站信息进行解码,并将结果输出到地址栏,否则不改变: 初始阶 ...
- php YAF
Yaf 的特点: 用C语言开发的PHP框架, 相比原生的PHP, 几乎不会带来额外的性能开销. 所有的框架类, 不需要编译, 在PHP启动的时候加载, 并常驻内存. 更短的内存周转周期, 提高内存利用 ...
- Compiling Inkscape on Windows
http://wiki.inkscape.org/wiki/index.php/Compiling_Inkscape_on_Windows http://www.oschina.net/news/80 ...
- oracle 表查询二
1.使用逻辑操作符号问题:查询工资高于500或者是岗位为manager的雇员,同时还要满足他们的姓名首字母为大写的J?select * from emp where (sal > 500 or ...
- 简易自定义下拉菜单 与简易默认下拉html片段
简易自定义下拉选择 html片段 html: <div class="select_box province"> <div class="selecte ...
- Miscellaneous--Tech
1. Questions: 1)EF.2)MVC/MVP/MVVM.3)page lifecyle. preInit,Init,InitCompleted,preLoad,Load,LoadCompl ...
- Swift-06-闭包
看完记不住,只好继续抄课文. 如果某个存储型属性的默认值需要特别的定制或者准备,就可以使用闭包或者全局函数来为其属性提供定制的默认值.每当某个属性所属的新类型实例创建时,对应的闭包或者函数会被调用,而 ...
- block iOS 块
block 是个很陌生的东西啊.以前没有学会,现在再看它,还是觉得很稀奇古怪. 无奈,之后硬着头皮学了.. //有参返回值 格式: 返回值类型 (^变量名)(参数类型及个数) = ^(形参列表){ 代 ...