美文网首页
Xpath 与Css 定位方式的比较

Xpath 与Css 定位方式的比较

作者: abb01857e1fc | 来源:发表于2019-04-29 12:41 被阅读0次

    1. CSS locator比XPath locator速度快,特别是在IE下面(IE没有自己的XPath 解析器(Parser))

    2. 对于文本的处理xpath更强大使用, text()匹配的是显示文本信息。

    String locator_Xpath = "//*[contains(text(),'test')]";

      但需要注意的是text()获取的是当前元素的文本,不包括其子元素的文本。如下代码text()得到的结果是"Please

    click here"。但如果使用$("#id1").text()获取的是"Memo Please click

    here",使用selenium获取元素text也是"Memo Please click here"。

    <div id="id1"><span>Memo<span>    Please click here</div>

    3. 对于class属性Css能直接匹配部分,而Xpath对于class跟普通属性一致,使用字符串精确匹配,需要使用contains()函数才能匹配部分字符串

                                    String locator_Xpath="//div[@class='class1 popup js-dragable alert-msg']//input[@class='class3']";

    String locator_Xpath="//div[contains(@class,'popup js-dragable alert-msg')]//input[@class='class3']";

    String locator_Css = ".class1.js-dragable .class3"

     4. 使用祖先元素属性与当前元素属性组合处理时

    <div class="111"><div><div><input class = "222"/></div></div></div>String locator_xpath="//div[@class='111'/*/*/*[@class='222']]";

    String locator_xpath="//div[@class='111'//[@class='222']]"String locator_css = ".111 .222";

     *注意两个class之间有一个空格表示层级关系,且空格选择所有层级的子元素,而>只选择一代

    5.模糊匹配

     XPathCss

    选取属性值中的部分string匹配//span[contains(@class,'popup-btn js-dragable')]span[title*='456']

     //input[starts-with(@name,'name1')]input[name^='name1']

     //input[ends-with(@name,'name1')]input[name$='name1']

     **ends-with() function is part of XPath 2.0 but browsers generally only support 1.0.

    6.多个属性匹配

        xpath=//a[@class='name' and value='123']

        css = a[.name][value='123']

    7. 第n个子元素的选择

    <div class="category_depth_1 bnr"><li><a href="/estore/kr/zh/c/1" class="on">护肤</a></li><li><a href="/estore/kr/zh/c/1" class="on">家电</a></li><li><a href="/estore/kr/zh/c/1" class="on">美妆</a></li><li><a href="/estore/kr/zh/c/1" class="on">母婴</a></li><li><a href="/estore/kr/zh/c/1" class="on">电子产品</a></li></div>String locator_Xpath = "//*[@class="category_depth_1 bnr"]//li[1]"String locator_Css = ".category_depth_1.bnr li:first-child"String locator_Css = ".category_depth_1.bnr li:last-child"String locator_Css = ".category_depth_1.bnr li:nth-child(1)"#index都是从1开始

    以上元素如果选择点击li元素有可能点击不生效而选择点击a标签,这个时候需要注意index还是要标在li标签后面String locator_Xpath = "//*[@class="category_depth_1 bnr"]//li[1]/a"

    String locator_Css = ".category_depth_1.bnr li:first-child a"

    String locator_Css = ".category_depth_1.bnr li:last-child>a"

    String locator_Css = ".category_depth_1.bnr li:nth-child(1)>a"

    8. 拥有某个属性的元素

      xpath= //*[@title]

      css= *[title]

    9. 拥有子元素a的P元素

      xpath= //div[a]

      css 不能实现

    10. 匹配祖先元素

      xpath= div[@id="id1"]//ancestor::tr//td

      css 不能实现

     11. 查找兄弟元素, Css只能查找元素后面的元素,不能向前找

      xpath= //div[@class="class1"]//preceding-sibling::div[1]

      xpath= //div[@class="class1"]//follow-sibling::div[1]

      css= div.class1+div

    12. 查找不包含not,以不包含display: none为例

      xpath= //div[@class="name" and not(contains(@style,"display: none"))]

      css= div.name:not([style*='display: none'])

    相关文章

      网友评论

          本文标题:Xpath 与Css 定位方式的比较

          本文链接:https://www.haomeiwen.com/subject/cphynqtx.html