八.python+selenium元素定位之css

css层叠样式表（英文全称：Cascading Style Sheets）。它原本是用来表现HTML和XML文件样式的语言。

css中使用selector(选择器)来作为selenium中元素定位的方法。

css相对其他定位方法来说比较灵活，几乎可以通过选择任意属性来对元素进行定位，也算是万能定位方法之一，在定位速度方面会比xpath快。

下面来看一下css使用id、class、name元素属性定位：（通过定位百度首页的输入框演示，参考上图）

1. HTML元素属性中id用#代替    例：id=kw  使用css定位时写成 #kw

2.HTML元素属性中class用点号（.）代替  例：class=s_ipt  使用css定位时写成 .s_ipt

3.HTML元素属性中的name需要加上中括号   例： name=wd  使用css定位时写成  [name=wd]

 

也可以通过标签名+元素属性 进行元素的定位：（通过定位百度首页的输入框演示，参考上图）

例如： 这个标签名为input+属性名定位时，当选择autocomplete="off"属性时：

css定位时写成  input[autocomplete='off']

 

还可以通过父标签名+子标签名+元素属性进行元素的定位：（通过定位百度首页的输入框演示，参考上图）

例如： 以上input的上一级是span，即span为父标签名，当选择maxlength="255"时：

css定位时写成   span>input[maxlength='255']

 

除此外还可以通过以上所有的 组合 来进行元素的定位：（通过定位百度首页的新闻演示，参考下图）

例如：a标签的父标签为div,而div的 id="u1", a标签下有个class="mnav"

css定位时写成   div#u1>a.mnav   (把id用#代替，class用点号.代替)

 

以下为代码演示：

#coding:utf-8
from selenium import webdriver #调用selenium中的webdriver包
from time import sleep #导入时间包
bro=webdriver.Firefox() #构建网页窗口对象
bro.maximize_window() #最大化窗口
bro.get("https://www.baidu.com/") #打开指定网址
# bro.find_element_by_css_selector("#kw").send_keys("123") #通过id定位  用#表示id
# bro.find_element_by_css_selector(".s_ipt").send_keys("123") #通过class定位  用.表示class_name
# bro.find_element_by_css_selector("[name=wd]").send_keys("123") #通过name定位 css用name时需要中括号括起来
#bro.find_element_by_css_selector("input[autocomplete='off']").send_keys("123") # 通过标签名+属性定位

# span表示父标签，input表示子标签，通过子标签下的maxlength属性定位元素
# bro.find_element_by_css_selector("span>input[maxlength='255']").send_keys("123")
# 通过maxlength属性定位元素在css定位中可以使用标签中的任意属性，但是属性必须是唯一标识这个元素的
#通过组合标签定位：
bro.find_element_by_css_selector("div#u1>a.mnav").click() #点击新闻
sleep(2)
bro.quit()