如何使用XPath选取嵌套div中特定段落文本对应的目标元素内容？

Got it, let's break down how to extract those target values from the HTML structure you described. Here's a step-by-step approach along with the extracted content:

First, we zero in on the <div class="specifics"> container, which holds multiple <div class="row"> elements. Each row follows a consistent pattern:

• A <div class="name"> wrapping a <p> tag with descriptive labels (like Light: or Type:)
• An adjacent <div class="value"> that contains the actual content we need to extract.

By matching the label text in the .name section, we pull the following relevant values:

• For the label Light: → Part Sun, Sun
• For the label Type: → Herb, Houseplant

If you need to automate this extraction on the client side, here's a straightforward code snippet:

// Target the main specifics container
const specificsContainer = document.querySelector('.specifics');
const plantInfo = {};

// Iterate through each row to find matching labels
specificsContainer.querySelectorAll('.row').forEach(row => {
  const labelText = row.querySelector('.name p').textContent.trim();
  const valueText = row.querySelector('.value').textContent.trim();

  // Capture values for our target labels
  if (labelText === 'Light:') {
    plantInfo.lightRequirements = valueText;
  } else if (labelText === 'Type:') {
    // Split multi-value entries into a clean array
    plantInfo.plantTypes = valueText.split(',').map(item => item.trim());
  }
});

console.log(plantInfo);
// Output: { lightRequirements: "Part Sun, Sun", plantTypes: ["Herb", "Houseplant"] }

内容的提问来源于stack exchange，提问作者whale-b