使用 JavaScript 通过 XPath 获取元素
本文将讨论如何在 Selenium WebDriver 中使用 JavaScript 通过 XPath 获取元素。
什么是 Selenium
Selenium 是一个自动化测试框架，用于在 Google Chrome、Mozilla Firefox、Safari 等多种浏览器中测试网站应用程序。
JavaScript、Java、Python 和 C# 等多种编程语言可以在 Selenium 中创建测试脚本。如果你使用的是 Selenium 提供的工具，则可以称为 selenium 测试。
Selenium 不是一个单一的工具，而是由多个可用于不同类型测试的软件组成，例如：
- Selenium Grid
- Selenium WebDriver
- Selenium 远程控制 (RC)
- Selenium 集成开发环境（IDE）。
什么是 Selenium-WebDriver
Selenium-Webdriver 用于通过使用各种编程语言（如 JavaScript、Java、Python、C# 等）在多个浏览器上执行测试脚本来执行测试。
Selenium-Webdriver 用于确保 Web 应用程序在生产环境中正常工作。它可以为你创建一个虚拟环境来测试应用程序。
selenium web 驱动程序有四个主要部分。
- 浏览器
- 浏览器驱动程序
- Selenium 客户端库
- JSON 有线协议
Selenium 中的 XPath 是什么
XPath 用于遍历网页的 XML 和 HTML 结构。
如果不使用 id、class 等 CSS 选择器，XPath 可以在网页上找到元素。XPath 可用于查找静态和动态元素（其属性可能因某些事件而改变）。
Selenium 中有两个 XPath。
- 绝对路径
- 相对路径
绝对路径
你可以在绝对路径中指定要定位的元素，从根标签 HTML 标签开始。然后，你可以通过定位子元素并使用正斜杠附加它们来向前移动。
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Absoulte Path</title>
</head>
<body>
<form id="login-form">
<input name="name" type="text" />
<input name="email" type="text" />
<input name="password" type="password" />
<button>Login</button>
</form>
</body>
</html>
看看上面的源代码；我们需要给出指向第一个输入的路径。
html/body/form/input[1]
这将首先访问 HTML 元素、body 元素，然后是 form，然后再移动到表单内的第三个输入元素。
相对路径
相对路径与绝对路径的不同之处在于它可以直接定位 HTML 元素。因此，在上面的源代码中，我们将编写双正斜杠（表示它是相对路径），然后从那里遍历，类似于在绝对路径中的方式。
///form/input[1]
在 Selenium WebDriver 中使用 JavaScript 通过 XPath 获取元素
document.evaluate 可以通过向其传递 XPath 表达式来获得 XPath 结果。
let HeadingElements = document.evaluate(
'/html/body//p', document, null, XPathResult.ANY_TYPE, null);
let NextHeading = HeadingElements.iterateNext();
let HeadingTexts = '';
while (NextHeading) {
HeadingTexts += NextHeading.textContent + '\n';
NextHeading = NextHeading.iterateNext();
}
console.log(HeadingTexts);
上面的源代码将针对每个目标段落元素（因为提供了 XPath）。它将取出每个段落的文本内容，将其附加到变量并注销结果。
相关文章
Do you understand JavaScript closures?
发布时间：2025/02/21 浏览次数：108 分类：JavaScript
-
The function of a closure can be inferred from its name, suggesting that it is related to the concept of scope. A closure itself is a core concept in JavaScript, and being a core concept, it is naturally also a difficult one.
Do you know about the hidden traps in variables in JavaScript?
发布时间：2025/02/21 浏览次数：178 分类：JavaScript
-
Whether you're just starting to learn JavaScript or have been using it for a long time, I believe you'll encounter some traps related to JavaScript variable scope. The goal is to identify these traps before you fall into them, in order to av
How much do you know about the Prototype Chain?
发布时间：2025/02/21 浏览次数：150 分类：JavaScript
-
The prototype chain can be considered one of the core features of JavaScript, and certainly one of its more challenging aspects. If you've learned other object-oriented programming languages, you may find it somewhat confusing when you start
用 jQuery 检查复选框是否被选中
发布时间：2024/03/24 浏览次数：102 分类：JavaScript
-
在本教程中学习 jQuery 检查复选框是否被选中的所有很酷的方法。我们展示了使用直接 DOM 操作、提取 JavaScript 属性的 jQuery 方法以及使用 jQuery 选择器的不同方法。你还将找到许多有用的
jQuery 中的 Window.onload 与 $(document).ready
发布时间：2024/03/24 浏览次数：180 分类：JavaScript
-
本教程演示了如何在 jQuery 中使用 Window.onload 和 $(document).ready 事件。
