zoukankan      html  css  js  c++  java
  • (八)WebDriver API之定位元素-CSS定位

    随笔记录方便自己和同路人查阅。

    #------------------------------------------------我是可耻的分割线-------------------------------------------

      学习selenium自动化之前,最好先学习HTML、CSS、JavaScript等知识,有助于理解定位及操作元素的原理。关于python和selenium安装请自行搜索别的资料,

    这里就不多做介绍了,所有例子均使用python3.6+selenium执行的。

    #------------------------------------------------我是可耻的分割线-------------------------------------------

    CSS定位

      CSSCascading Style Sheets)是一种语言,它用来描述HTMLXML文档的表现。CSS使用选择器来为页面元素绑定属性。这些选择器可以被selenium用作另外的定位策略。

    CSS可以较为灵活的选择空间的任意属性,一般情况下定位速度要比XPath快,但对于初学者来说学习起来稍微有点难度,下面我们就详细地介绍CSS的语法与使用。

    选择器

    例子

    描述

    .class

    .intro

    class选择器,选择class=’intro’的所有元素

    #id

    #firstname

    Id选择器,选择id=’firstname’的所有元素

    *

    *

    选择所有元素

    element

    p

    所有<p>元素

    Element > element

    div > input

    选择父元素为<div>的所有<input>元素

    Element + element

    div + input

    选择同一级中紧接在<div>元素之后的所有<input>元素

    [attribute=value]

    [target=_blank]

    选择target=’_blank’的所有元素

    下面同样以百度输入框和搜索按钮为例介绍CSS定位的用法。

    ...

    <span class=’bg s_ipt_wr’>

    <input id=’kw’ class=’s_ipt’ sutocomplete=’off’ maxlength=’100’ value=’’ name=’wd’

    </span>

    <span class=’bg s_ipt_wr’>

    <input id=’su’ class=’bg s_btn’ type=’submit’ value=’百度一下’ 

    </span>

    ...

    1)通过class属性定位:

    find_element_by_css_selector(‘.s_ipt’)

    find_element_by_css_selector(‘.bg s_btn’)

    find_element_by_css_selector()方法用于CSS语言定位元素,点号(.)表示通过class属性来定位元素。

    2)通过id属性定位:

    find_element_by_css_selector(‘#kw’)

    find_element_by_css_selector(‘#su’)

    井号(#)表示通过id属性来定位元素

    3)通过标签名定位:

    find_element_by_css_selector(‘input’)

    CSS语言中,用标签名定位元素不需要任何符号标识,直接使用标签名即可。但我们前面已经了解了,标签名重复的概率非常大,所以通过这种方式很难找到想要的元素。

    我们可以通过以下几种方式来使标签名查找方式生效:

    1、通过父子关系定位:

    find_element_by_css_selector(‘span>span’)

    上面的写法表示有父亲,它的标签名为span,查找它的所有标签名交input的子元素

    2、通过属性定位:

    find_element_by_css_selector(“[autocomplete=off]”)

    find_element_by_css_selector(“[name=’kw’]”)

    find_element_by_css_selector(“[type=’submit’]”)

    CSS当中也可以使用元素的任意属性,只要这些属性可以唯一标识这个元素。对于属性值来说,可加引号,也可以不加,但注意和整个字符串的引号进行区分。

    3、组合定位:

    我们当然可以把上面的定位策略组合起来使用,这就大大加强了定位元素的唯一性。

    find_element_by_css_selector(“span.bg s_ipt_wr>input.s_ipt”)

    find_element_by_css_selector(“span.bg s_ipt_wr>input#su”)

    有一个父元素,它的标签名叫span;它有一个class属性值叫bg s_ipt_wr;它有一个子元素,标签名叫inout,并且这个子元素的class属性值叫s_ipt。好吧,我们要找的就是具有这么多特征的一个子元素。

  • 相关阅读:
    电脑处理器i5和i7的区别,如何选择?
    趣漫揭秘!中国程序员生存现状?
    趣漫揭秘!中国程序员生存现状?
    程序员职业规划
    程序员职业规划
    盘点程序员开发遇到的30个问题
    盘点程序员开发遇到的30个问题
    推荐VSCode12个比较实用的插件
    Flask之模板之宏、继承、包含
    Flask之模板之控制语句
  • 原文地址:https://www.cnblogs.com/lirongyang/p/11457498.html
Copyright © 2011-2022 走看看