1. <html>
  2. <head>
  3. <title></title>
  4. </head>
  5. <body>
  6. <span class="bg s_ipt_wr quickdelete-wrap">
  7. <input id="kw" name="wd" class="s_ipt" value="" maxlength="255" autocomplete="off">
  8. <a href="javascript:;" id="quickdelete" title="清空" class="quickdelete" style="top: 0px; right: 0px; display: none;" name="quickdelete"></a>
  9. <span class="soutu-hover-tip" style="display: none;">按图片搜索</span></span>
  10. </body>
  11. </html>

CSS定位

find_element_by_css_selector()
find_elements_by_css_selector()

1.CSS选择器常见语法

选择器 例子 描述
.class .s_ipt class选择器,选择所有class=”s_ipt”的所有元素
#id #kw id选择器,选择id=”kw”的所有元素
* * 选择所有元素
element input 选择所有元素
element>element div>input 选择父元素为div的所有input元素
element+element div+input 选择同级中紧接在div之后的所有input元素
[attribute=value] [name=wd] 选择所有name=”wd”的所有元素

2.通过id定位

  1. dirver.find_element_by_css_selector("#kw")

3.通过class定位

  1. dirver.find_element_by_css_selector(".s_ipt")

4.通过标签名定位

  1. dirver.find_element_by_css_selector("input")

5.通过标签层级定位

  1. dirver.find_element_by_css_selector("div>input")

6.通过属性定位

  1. dirver.find_element_by_css_selector("input[name='wd']")

7.组合定位

  1. dirver.find_element_by_css_selector("div>input[name='wd']")

8.逻辑定位

css的逻辑定位不需要像xpath用and等逻辑运算符连接

  1. dirver.find_element_by_css_selector("input[class='control'][type='text']")

9.模糊匹配定位

  • 匹配class属性包含”s_ipt”的元素

    1. driver.find_element_by_css_selector([class*='s_ipt'])
  • 匹配class属性以”s_ipt”开头的元素

    driver.find_element_by_css_selector([class^='s_ipt'])
    
  • 匹配class属性以”s_ipt”结尾的元素

    driver.find_element_by_css_selector([class$='s_ipt'])