• Selenium基础 — CSS选择器定位大全


    1、css属性定位

    css选择器策略示例说明
    #id#telA选择id="telA"的所有元素。
    .class.telA选择 class="telA”的所有元素。
    [属性名=属性值][name=telA]除了id和class属性,其他属性的定位格式
    [attribute][target]选择带有target 属性所有元素。
    **选择所有元素。

    2、css属性值模糊匹配定位

    css选择器策略示例说明
    [attribute^=value]a[src^="https"]选择其src 属性值以"https”开头的每个元素。
    [attribute$=value]a[src$=".pdf"]选择其src属性以".pdf“结尾的所有元素。
    [attribute*=value]a[src*="abc"]选择其src 属性中包含“abc"子串的每个元素。
    [attribute~=value]a[title~=flower]定位标签属性title值中有独立flower词汇的节点
    [attribute=value]a[lang=en]用于选取带有以指定值开头的属性值的元素。

    注意:[attribute|=value]
    该值必须是整个单词,比如 lang="en",或者后面跟着连字符,比如 lang="en-us"。文章地址https://www.yii666.com/blog/409796.html

    3、css标签定位

    css选择器策略示例说明
    elementp定位所有

    元素。

    标签名[属性名=属性值]input#telA定位id属性值为telA的所有元素

    4、css层级关系定位

    css选择器策略示例说明
    element,elementdiv,p选择所有
    元素和所有

    元素。

    element elementdiv p选择
    元素内部的所有

    元素。包括子孙后代。

    element>elementdiv>p选择父元素为
    元素的所有

    元素。只包括子代。

    element+elementdiv+p选择紧接在
    元素之后的所有

    元素。同辈元素。

    示例:

    css选择器策略示例说明
    需要使用 > 或 空格表示层级关系语法
    父标签名[父标签属性名=属性值]>子标签名p#p1>input定位id属性值为p1的元素
    父标签名[父标签属性名=属性值] 子标签名p#p1 input同上

    5、css索引定位

    css选择器策略示例说明
    :only-childp:only-child选择属于其父元素的唯一子元素的每个

    元素。

    :nth-child(n)p:nth-child(2)选择属于其父元素的第二个子元素的每个

    元素。

    :nth-last-child(n)p:nth-last-child(2)同上,从最后一个子元素开始计数。
    :nth-of-type(n)p:nth-of-type(2)选择属于其父元素第二个

    元素的每个

    元素。

    :nth-last-of-type(n)p:nth-last-of-type(2)同上,但是从最后一个子元素开始计数。

    6、css逻辑运算定位

    css选择器策略逻辑定位
    示例标签名[属性名1=属性值1][属性名2=属性值2]
    示例input[type='telA'][placeholder='电话A']
    说明同时匹配多个属性

    7、css元素状态定位

    选择器例子例子描述
    :emptyp:empty选择没有子元素的每个

    元素(包括文本节点)。

    :target#news:target选择当前活动的 #news 元素。
    :enabledinput:enabled选择每个启用的 元素。
    :disabledinput:disabled选择每个禁用的 元素
    :checkedinput:checked选择每个被选中的 元素。
    :not(selector):not(p)选择非

    元素的每个元素。

    七 、总结

    • 如果元素有明确idnameclass属性时,使用对应的基本定位方法。
    • 如果没有idnameclass属性时,或idnameclass属性是动态/不唯一的时候,使用XPathcss_selector定位。
    • 定位页面超链接使用link_textpartial_link_text定位
    • 可使用XPathcss_selector定位的时候,优先使用css_selector
      css_selector定位的速度和效率比Xpath高。
    • 没有最好的,只有最精简的,怎么简单怎么来。

    扩展:为什么css_selector定位的速度和效率比Xpath高?
    因为你无论用那种方式定位,最终都会转换到css_selector进行元素定位。
    我们可以在PyCharm中,安装ctrl点击对应的方法,进行查看源码,最终都会定位到如下代码:

    1. def find_element(self, by=By.ID, value=None):
    2. """
    3. Find an element given a By strategy and locator. Prefer the find_element_by_* methods when
    4. possible.
    5. :Usage:
    6. element = driver.find_element(By.ID, 'foo')
    7. :rtype: WebElement
    8. """
    9. if self.w3c:
    10. if by == By.ID:
    11. by = By.CSS_SELECTOR
    12. value = '[id="%s"]' % value
    13. elif by == By.TAG_NAME:
    14. by = By.CSS_SELECTOR
    15. elif by == By.CLASS_NAME:
    16. by = By.CSS_SELECTOR
    17. value = ".%s" % value
    18. elif by == By.NAME:
    19. by = By.CSS_SELECTOR
    20. value = '[name="%s"]' % value
    21. return self.execute(Command.FIND_ELEMENT, {
    22. 'using': by,
    23. 'value': value})['value']

  • 相关阅读:
    从“专家”视角看:2024年软件测试行业的八大发展趋势!
    汽车电子中的安森美深力科分享一款高性能车规级芯片NCV7520MWTXG
    基于javaweb+mysql的电影票售票管理系统
    七牛云图床设置
    JMeter添加插件
    释放潜力:人工智能对个性化学习的影响
    十、AT24C02
    学习笔记-OS - Exploits
    进程地址空间续篇-Linux
    ABAP接口部分-Web Service提供者与消费者
  • 原文地址:https://blog.csdn.net/weixin_64974855/article/details/132593883