selenium Python 学习笔记之三 CSS 元素定位

1、什么是CSS？

　　CSS是层叠样式表，是一种用来表现HTML或xml等文件样式的语言。CSS不仅可以静态的修饰网页，还可以配合各种脚本语言动态的对网页各元素进行格式化

　　CSS能够对网页中元素位置的排版进行像素级精确控制，支持所有的字体样式，拥有对网页对象和模型样式编写的能力

　　

CSS还可以用来在selenium中定位元素

 

CSS定位元素的方法：

　　find_element_by_css_selector(css_selector) # css_selector 表示的是css选择器表达式

2、CSS定位策略

　　id选择器

　　class选择器

　　元素选择器

　　属性选择器

　　层级选择器

 2.2.1 id选择器

　　--表达式  #id   # 表示通过元素的id的属性进行元素的选择，id表示的id属性的值

2.2.2 class 选择器

　　表达式  .class  # . 表示通过元素的class属性进行元素选择，class表示的class属性的其中一个属性值

2.2.3 元素选择器

　　就是通过元素标签名称来选择元素。表达式  tag_name  不推荐 --- 原因：tag_name 重复的太多了，很难精准的定位到一个元素的位置

2.2.4 属性选择器

　　就是通过元素的属性来选择元素，表达式[attribute = 'value']

　　# attribute 为属性的名称，value为属性的值

　　eg:　　[placeholder = "请输入用户名"]

　　如果使用的是class属性，需要带上class的全部属性值

2.2.5 层级选择器

　　-父子层级关系选择器

　　　　表达式：element1>element2 通过element1找element2并且element2是element1的直接子元素

　　-隔代层级关系选择器

　　　　表达式：element1  element2 通过element1 来找element2，element2 是element1的后代元素

　　eg:　　#pa > input

　　　　　#pa  label

2.2.6 CSS扩展

　　-input[type^ = 'value'] input 表示标签名称，type表示属性名称，value表示的文本内容   --查找元素type属性值是以value开头的元素

　　-input[type$ = 'value'] input表示标签名称，type表示属性名称，value表示的文本内容 -查找元素type属性值以value结尾的元素

　　-input[type*='value'] input 表示标签名称，type表示属性名称，value表示文本内容，查找元素包含value‘的元素

　　eg:　　input[placeholder*="用户名"]

　　　　　 input[placeholder$="密码"]

　　　　　 input[placeholder^="延时"]

元素定位总结：

　　1、直接用selenium中自带的定位元素函数定位，find_element_by_id(id);find_element_by_class_name(class_name)等来定位

　　2、使用xpath中的定位方法来定位 find_element_by_xpath(xpath)来定位

　　　　--路径定位

　　　　　　--绝对路径

　　　　　　--相对路径

　　　　--元素的属性定位

　　　　　　//tag_name[@attribute = 'value' ]

　　　　--属性与逻辑结合

　　　　　　//tag_name[@attribute = 'value' and @attribute2 = 'value2']

　　　　--属性与层级结合

　　　　　　//tag_name[@attribute='value']/input

　　3、css定位，css定位效率最高  但是使用最多的是xpath或者css