尝试使用 JSOUP 在嵌套的 DIV 标记中检索 SPAN 标记

Question

您好，我正在尝试使用 JSoup 提取嵌套 DIV 标记中的跨度标记。下面的代码只是更大代码的sn-p。

<div class="formitem formgroup horizontal">
  <div class="formitem formgroup horizontal">
    <div class="formitem formgroup vertical" style="width:325px">
      <div class="formitem formgroup horizontal">
        <div class="formitem formgroup vertical" style="width:325px;">
          <div class="formitem formgroup horizontal">
            <span class="formitem formfield">
                            <span class="value" style="font-weight:bold">47 Lower River St</span>
            </span>
            <span class="formitem formfield">
                            <span class="value" style="font-weight:bold">531</span>
            </span>
          </div>
        </div>
      </div>
      <div class="formitem formgroup horizontal">
        <span class="formitem formfield">
                    <span class="value" style="font-weight:bold">Toronto</span>
        </span>
        <span class="formliteral formitem" />
        <span class="formitem formfield">
                    <span class="value">Ontario</span>
        </span>
        <span class="formliteral formitem" />
        <span class="formitem formfield">
                    <span class="value">M5A0G1</span>
        </span>
      </div>
    </div>
    <div class="formitem formgroup vertical" style="width:150px;">
      <div class="formitem formgroup horizontal">
        <span class="formitem formfield">
                    <label>List:</label>
                    <span class="value" style="font-weight:bold">$279,900</span>
        </span>
        <span class="formitem formfield">
                    <label>For:</label>
                    <span class="value" style="font-weight:bold">Sale</span>
        </span>
      </div>
    </div>
  </div>
  <span class="formitem formfield">
        <span class="value">Toronto C08</span>
  </span>
  <span class="formliteral formitem" />
  <span class="formitem formfield">
        <span class="value">Moss Park</span>
  </span>
  <span class="formliteral formitem" />
  <span class="formitem formfield">
        <span class="value">Toronto</span>
  </span>
  <span class="formitem formfield">
        <span class="value">120-21-S</span>
  </span>
</div>

我正在尝试提取最后一个 SPAN 标签中的文本（Toronto C08、Moss Park、Toronto 和 120-21-S）

<span class="formitem formfield">
    <span class="value">Toronto C08</span>
</span>
<span class="formliteral formitem" />
<span class="formitem formfield">
    <span class="value">Moss Park</span>
</span>
<span class="formliteral formitem" />
<span class="formitem formfield">
    <span class="value">Toronto</span>
</span>
<span class="formitem formfield">
    <span class="value">120-21-S</span>
</span>

我已经成功地解析了文档的其他部分，但是我似乎无法隔离这些跨度。代码的 sn-p 来自更大的页面 (full page)。我可能使用了错误的方法，但这是我为捕获父 DIV 之间的跨度所做的工作（结果在帖子的顶部）。

Elements elements = doc.select("div[class=formitem legacyBorder formgroup vertical]");
        Element zoneElement = elements.select("div[class=formitem formgroup vertical")
                 .select("[style=width:500px]").select("div[class=formitem formgroup horizontal").first();

所以现在我有了第一个元素，但我需要选择代码块末尾的最后 6 个 span 标签。谢谢

Answer 1

打开浏览器的developer tool (F12)，选择“检查元素”工具，突出显示您想要的字段（例如 TORONTO C08）并选择其css selector。对于“多伦多 C08”，它将是：

#C3627690 > div:nth-child(3) > div:nth-child(2) > div:nth-child(1) > div:nth-child(1) > div:nth-child(1) > div:nth-child(1) > div:nth-child(2) > div:nth-child(1) > span:nth-child(2) > span:nth-child(1)

对所有其他元素执行相同的操作。获得所有选择器后，仔细检查它们 - 也许它们有一个共同的模式（例如，仅在第 3 个值处不同），因此您将能够通过循环对其进行迭代。