如何通过父DIV内容提取嵌套DIV中的指定目标文本

你当前的XPath //div[contains(., 'Location')] 匹配的是包含“Location”的父级div，但目标文本“Town Center”在它内部的嵌套元素里，以下是几种精准提取的方法：

方法一：用精准XPath直接定位目标元素 #

通过定位<strong>Location</strong>元素，再找到它后续的子元素，直接拿到目标div：

// 定位到Location标签后的目标div
var targetElement = document.evaluate("//strong[text()='Location']/following-sibling::span/div", document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
if (targetElement) {
  var locationText = targetElement.textContent.trim();
  console.log(locationText); // 输出 "Town Center"
}

如果页面有多个类似结构，建议限定在指定卡片内查找，避免误匹配：

// 限定在id为grant-title-panel的卡片范围内查找
var targetElement = document.evaluate("//div[@id='grant-title-panel']//strong[text()='Location']/following-sibling::span/div", document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;

方法二：基于原有结果二次筛选 #

如果不想修改原XPath，可以先拿到父div，再用DOM查询提取内部文本：

var parentDiv = document.evaluate("//div[contains(., 'Location')]", document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
if (parentDiv) {
  // 找到内部的目标div并提取文本
  var locationText = parentDiv.querySelector("span.text-uppercase div").textContent.trim();
  console.log(locationText);
}

关键说明 #

原来的XPath匹配的是包含“Location”文本的整个col-sm-6容器div，而“Town Center”是这个容器内的子节点内容，所以需要精准定位到那个最小的div元素才能拿到目标文本。

内容的提问来源于stack exchange，提问作者Jeff