网页爬取：如何选择嵌套结构中无div子元素的底层div

问题场景 #

爬取的网站HTML结构如下（无class/id）：

<div>
  <div>
    <div>
      Some content
    </div>
  </div>
  <div>
    Other content
  </div>
</div>

使用doc.css('div div')选择时，嵌套的div会被重复匹配，调用doc.css('div div').map(&:text)会返回两次"Some content"，无法获取唯一的最底层内容。

解决方案 #

要选择不包含div子元素的div（即最底层的目标div），可以用以下两种方法：

• CSS选择器方案：使用:not(:has(div))伪类组合，直接过滤掉包含子div的容器：

  doc.css('div:not(:has(div))').map(&:text)
  

  该选择器会精准匹配所有没有div子元素的div，返回结果为["Some content", "Other content"]，无重复内容。

• XPath兼容方案：如果你的解析器不支持:has()伪类（如旧版Nokogiri），可以改用XPath表达式：

  doc.xpath('//div[not(div)]').map(&:text)
  

  效果与CSS方案完全一致，同样能选中最底层的目标div。

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