`

selenium之By.cssSelector与By.xpath的区别

xpathcssSelector 
阅读更多
1、搜索路径中间的某个节点所在层级有多个该dom节点时，xpath和cssSelector会在多个节点中均搜索后续的节点，如测试1.
2、搜索路径最后一个节点下仍包含该类型的dom节点时，cssSelector会将包含的同名节点也搜索出来，xpath则不会继续向下搜索，只打印搜索路径中的最后一个dom节点，如测试2.
3、查找第几个子节点
   xpath：div[2]，查找到父节点下的所有div节点后，取第二个div返回
   cssSelector：div:nth-child(2)，查找父节点下的第2个节点，如果该节点是div，则返回否则找不到元素
                div:first-child，div是父节点下的第一个节点，则返回该div元素
                div:last-child，div是父节点下的最后一个节点，则返回该div元素
详见测试3.

测试1：
dom节点： 
<div class="detail-time-picker">
   <div class="indicator top">
      <span class="sfi sfi-chevron-up">
      </span>
   </div>
   <div class="picker-wrapper">
      <ul class="times">
   </div>
   <div class="indicator bottom">
      <span class="sfi sfi-chevron-down"></span>
   </div>
</div>

xpath测试代码： 
List<WebElement> eless = driver.findElements(By.xpath("//div[@class='detail-time-picker']/div/span"));
for(int i=0;i<eless.size();i++){
    System.out.println("the list classvalue:"+eless.get(i).getAttribute("class"));
    System.out.println("the list tagname:"+eless.get(i).getTagName());
}

结果： 
the list classvalue:sfi sfi-chevron-up
the list tagname:span
the list classvalue:sfi sfi-chevron-down
the list tagname:span

cssSelector测试代码： 
List<WebElement> eless = driver.findElements(By.cssSelector("div.detail-time-picker div span"));
for(int i=0;i<eless.size();i++){
    System.out.println("the list classvalue:"+eless.get(i).getAttribute("class"));
    System.out.println("the list tagname:"+eless.get(i).getTagName());
}

结果： 
the list classvalue:sfi sfi-chevron-up
the list tagname:span
the list classvalue:sfi sfi-chevron-down
the list tagname:span

测试2：
dom节点： 
<div class="detail-date-picker">
    <div class="datepicker datepicker-inline">
       <div class="datepicker-days" style="display: block;" />
       <div class="datepicker-months" style="display: none;" />
       <div class="datepicker-years" style="display: none;" />
    </div>
</div>

xpath测试代码： 
List<WebElement> eless = driver.findElements(By.xpath("//div[@class='detail-date-picker']/div"));
for(int i=0;i<eless.size();i++){
    System.out.println("the list classvalue:"+eless.get(i).getAttribute("class"));
    System.out.println("the list tagname:"+eless.get(i).getTagName());
}

结果： 
the list classvalue:datepicker datepicker-inline
the list tagname:div

cssSelector测试代码： 
List<WebElement> eless = driver.findElements(By.cssSelector("div.detail-date-picker div"));
for(int i=0;i<eless.size();i++){
    System.out.println("the list classvalue:"+eless.get(i).getAttribute("class"));
    System.out.println("the list tagname:"+eless.get(i).getTagName());
}

测试结果： 
the list classvalue:datepicker datepicker-inline
the list tagname:div
the list classvalue:datepicker-days
the list tagname:div
the list classvalue:datepicker-months
the list tagname:div
the list classvalue:datepicker-years
the list tagname:div


测试3：
dom节点： 
<body>
<div>
<button id="b" onclick = "show_div()">click</button>
</div>
<div id="test">
<div>
  <div class="di1"><p>this is a test text.</p></div>
  <h5 class="h555">hello,this is h5</h5>
  <dl class="firstdl"></dl>
  <dl class="seconddl"></dl>
  <dl class="thirddl"></dl>
</div>
<div>
  <p>pppppppp</p>
  <dl class="dl1"></dl>
  <dl class="dl2"></dl>
  <div class="divdiv1"><p>this is a test text.</p></div>
  <h5 class="h5h55">hello,this is h5</h5>
</div>
<div>second div</div>
</div>
</body>

xpath测试代码： 
List<WebElement> ele = driver.findElements(By.xpath("//div[@id='test']/div/dl[1]"));
System.out.println("number is:"+ele.size());
for(int i=0;i<ele.size();i++){
System.out.println("第"+i+"个元素的class值为"+ele.get(i).getAttribute("class"));
}

结果： 
number is:2
第0个元素的class值为firstdl
第1个元素的class值为dl1

cssSelector测试代码： 
List<WebElement> ele = driver.findElements(By.cssSelector("div#test div dl:nth-child(3)"));
System.out.println("number is:"+ele.size());
for(int i=0;i<ele.size();i++){
System.out.println("第"+i+"个元素的class值为"+ele.get(i).getAttribute("class"));
}

结果： 
number is:2
第0个元素的class值为firstdl
第1个元素的class值为dl2
分享到：
| junit一个测试方法测试多种数据
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    WebDriver xpath css selector

    它与Selenium测试框架紧密相连，成为了自动化测试人员常用的测试工具之一。WebDriver提供了丰富的API接口，使得测试人员可以轻松地进行页面元素定位、输入数据、点击操作等。此外，WebDriver支持多种浏览器，如...

    Selenium WebDriver 学习笔记

    - **CSS Selector**：`driver.findElement(By.cssSelector("selector"))` - **XPath**：`driver.findElement(By.xpath("xpathExpression"))` 其中，**CSS选择器**和**XPath**是比较灵活的选择方式，可以根据不同的...

    selenium-python.pdf

    element = driver.find_element_by_css_selector("#my_div &gt; p") ``` #### 五、等待机制 Selenium 支持两种类型的等待机制：显式等待和隐式等待。 **5.1 显式等待** 显式等待是指等待某个条件成立后继续执行。...

    selenium_153.zip

    2. CSS选择器：`driver.find_element_by_css_selector('css_selector')` 3. XPath定位：`driver.find_element_by_xpath('//xpath_expression')` 五、断言和异常处理 在测试过程中，断言用于验证预期结果是否符合...

    selenium-2.41.0.tar.gz

    from selenium.webdriver.common.by import By from selenium.webdriver.support.ui import WebDriverWait from selenium.webdriver.support import expected_conditions as EC # 显式等待，直到元素可见 element =...

    selenium-2.36.0.tar.gz

    例如，`find_element_by_id()`用于根据ID找到元素，`find_element_by_css_selector()`则可以根据CSS选择器查找元素。 四、自动化测试框架集成 Selenium可以与Python的测试框架如unittest、pytest等无缝集成，使得...

    查找元素的方法.docx

    此外，CSS选择器还支持部分属性值匹配，如`driver.findElement(By.cssSelector("[type^='text']"))`（匹配`type`属性以`text`开头的元素），`driver.findElement(By.cssSelector("[title$='save']"))`（匹配`title`...

    selenium-2.49.0.tar.gz

    3. **元素定位**：Selenium 提供了多种方式来定位网页中的元素，如通过ID、CSS选择器、XPath等。这使得开发者可以精确地找到页面上的任何元素，并进行点击、输入、检查等操作。 4. **事件模拟**：它可以模拟用户的...

    自动化测试：Selenium webdriver学习笔记C#版

    在 Selenium 中，我们可以使用多种方法来定位元素，包括 Id、Name、TagName、ClassName、CssSelector 和 XPath 等。下面我们将详细介绍每种方法的使用。 1. Id 定位方法 使用 Id 定位方法可以根据元素的 Id 属性来...

    谷歌浏览器插件 SelectorsHub 编写和验证xpath、cssSelector、Playwright

    它可以作为智能编辑器来编写和验证xpath、cssSelector、Playwright选择器、jQuery和JSPath。SelectorHub还可以用于自动生成唯一的#xpath、css选择器和所有可能的选择器。 but，毕竟是机器生成的，路径有时候不是很...

    selenium-2.19.1.tar.gz

    例如，`find_element_by_css_selector(selector)`和`find_element_by_xpath(xpath)`可以帮助我们精准地找到目标元素。 在实际测试中，我们还可以利用Selenium的等待机制，如`time.sleep()`和`WebDriverWait`，来...

    SeleniumWebDriver菜谱

    WebElement elementByCss = driver.findElement(By.cssSelector("div.myClass")); WebElement elementByXPath = driver.findElement(By.xpath("//div[@id='myId']")); ``` 2. **使用 `findElements` 方法来定位...

    selenium-2.23.0.tar.gz

    在Selenium中，我们可以使用多种策略来定位网页上的元素，如ID、name、class name、tag name、link text、partial link text、CSS selector以及XPath表达式。这些定位方法为精确选择网页元素提供了灵活性，是编写...

    selenium自动化文档

    Selenium 自动化文档 Selenium 是一个流行的自动...以上是 Selenium 自动化文档的详细知识点总结，涵盖了元素定位方法、WebDriver 的基本操作、元素操作、XPath 定位器、CssSelector 定位器和层级定位等方面的知识点。

    selenium学习3：元素定位方法.docx

    - CSS选择器定位：使用CSS选择器，如`By.cssSelector(selector)`，例如`By.cssSelector("input.skin-search-button")`。 Selenium还支持链式定位，即通过一个元素找到另一个相关的元素，这在处理嵌套元素或者有关系...

    selenium学习完结散花.docx

    from selenium.webdriver.common.by import By from selenium.webdriver.support.ui import WebDriverWait from selenium.webdriver.support import expected_conditions as EC wait = WebDriverWait(wd, 10) ...

    python 解决selenium 中的 .clear()方法失效问题

    from selenium.webdriver.common.by import By from selenium.webdriver.support import expected_conditions as EC from selenium.webdriver.support.ui import WebDriverWait ``` 2. **创建 WebDriver 实例并...

    UI自动化selenium封装常用工具类（元素定位方法，鼠标动作，浏览器操作等）

    from selenium.webdriver.common.by import By element = driver.find_element(By.ID, "element_id") ``` 2. `By.XPATH`：通过XPath表达式定位元素，适用于复杂结构的DOM。 ```python element = driver.find_...

Magicbox
Global site tag (gtag.js) - Google Analytics