你想知道如何在浏览器中使用 $x("//span[contains(text(),'王中王精解金多宝')]") 这个 XPath 表达式查询到目标内容，对吧？首先要明确 $x() 的特殊性质，再分析你的表达式失效原因，最后给出可直接使用的解决方案。
一、先明确：$x() 是什么？
$x() 不是标准的 JavaScript API，它是 Chrome、Edge 等 Chromium 内核浏览器以及 Firefox 浏览器的 开发者工具（DevTools）专属快捷命令，仅用于在开发者工具的「Console（控制台）」面板中快速测试 XPath 表达式，无法在普通的 JS 代码（如 HTML 中的 <script> 标签、外部 JS 文件）中直接使用。
使用场景：打开浏览器 F12 进入 DevTools → 切换到 Console 面板 → 直接输入 $x(XPath表达式) 即可快速返回查询结果，方便调试 XPath 语法。
二、你的 XPath 表达式失效的核心原因
你的表达式 $x("//span[contains(text(),'王中王精解金多宝')]") 无法查询到目标内容，核心问题在于 text() 节点的匹配逻辑与目标文本的 DOM 结构不匹配：
- 从你提供的 HTML 可以看到，「王中王精解金多宝」这段文本被多个
<span> 标签嵌套包裹，且前后都有 <img> 标签，属于「多个子节点（包含元素节点、文本节点）混合存在」的结构。 text() 只会获取当前 <span> 节点下的直接文本子节点，不会递归获取子 <span> 中的文本，也无法忽略 <img> 这类元素节点的干扰，导致 contains(text(), '王中王精解金多宝') 无法匹配到完整文本。
三、解决方案：修改 XPath 表达式（3 种可行方案）
方案 1：使用 string() 或 normalize-space()（推荐，最稳定）
string() 会获取目标节点下的所有文本内容（递归获取所有子节点的文本，忽略元素节点），normalize-space() 还能顺带去除文本前后的空白字符，匹配更精准。
// 方案1.1：使用 string() 获取完整文本
$x("//span[contains(string(), '王中王精解金多宝')]")
// 方案1.2：使用 normalize-space()（去除首尾空白，推荐）
$x("//span[contains(normalize-space(), '王中王精解金多宝')]")方案 2：使用 ./descendant::text() 匹配所有后代文本节点
descendant::text() 会递归获取当前 <span> 节点下的所有后代文本节点（包括子、孙辈等所有文本节点），再通过 contains() 匹配包含目标文本的节点。
$x("//span[contains(./descendant::text(), '王中王精解金多宝')]")方案 3：精准匹配包含目标文本的最内层 <span>
如果想直接定位到包裹「王中王精解金多宝」的那个 <span>，可以缩小范围，避免匹配外层多余的 <span>：
$x("//span[contains(normalize-space(), '王中王精解金多宝') and not(span[contains(normalize-space(), '王中王精解金多宝')])]")四、操作步骤（在浏览器 DevTools 中验证）
- 打开目标页面，按下
F12 打开开发者工具（DevTools）。 - 切换到「Console（控制台）」面板。
- 直接复制上面任意一个修改后的 XPath 表达式，粘贴到控制台并按下回车。
- 成功返回匹配的
<span> 节点数组，点击数组中的节点可在 Elements 面板中定位到对应的 DOM 元素，即为查询成功。
五、补充：如果需要在普通 JS 代码中使用（替代 $x()）
如前所述，$x() 是 DevTools 专属，普通 JS 代码中需要使用标准的 document.evaluate() 来实现，示例如下（以方案 1.2 为例）：
// 1. 定义 XPath 表达式const xpathExpr = "//span[contains(normalize-space(), '王中王精解金多宝')]";// 2. 执行 XPath 查询（获取所有匹配节点）const result = document.evaluate(
xpathExpr,
document,
null,
XPathResult.ORDERED_NODE_SNAPSHOT_TYPE,
null);// 3. 遍历并查看结果for (let i = 0; i < result.snapshotLength; i++) {
const targetSpan = result.snapshotItem(i);
console.log("匹配到的节点：", targetSpan);
console.log("节点文本内容：", targetSpan.textContent.trim());}总结
$x() 是浏览器 DevTools 专属调试命令，非标准 JS API，仅用于控制台快速测试 XPath。- 原表达式失效的核心是
text() 无法递归获取嵌套文本，受外层 DOM 结构干扰。 - 最优解决方案是使用
normalize-space() 或 string() 改写 XPath，可精准匹配嵌套的目标文本。 - 普通 JS 代码中需用
document.evaluate() 替代 $x()，实现相同的 XPath 查询功能。
