带有 dd 和 dt 条件的 web scraper chrome 扩展

Question

我想在网络上提取一些数据，我正在使用 chrome 提供的网络爬虫开发工具。我的网页包含一个部分，其中列出了每个产品的详细信息（有关图形卡、处理器、显示器等的详细信息）。但是每个部分都包含很多行，并且这些行的位置是不固定的。如果它是使用 TR 和 TD 标签描述的，那么我可以应用这样的条件（例如：tr:contains('Prozessortyp') td.value）这个条件确认，如果行值是“Prozessortyp”，那么只有对应的td值。

但我正在提取的网站已经使用 dd 和 dt 标签进行了描述。我将附上一个特定部分的详细屏幕截图。

当我想在本节中选择第一行时，它在网络爬虫中提供的选择器是 section:nth-of-type(2) dd:nth-of-type(1) 。但是我如何设置条件，当行有一个键“Arbeitsspeicher-Typ”时，然后选择相应行中的值。

谢谢你:)

Answer 1

CSS 选择器实际上能够选择元素的兄弟姐妹。对于这个用例，您需要Adjacent Sibling Selector (+)：

dt:contains("Arbeitsspeicher-Typ") + dd
dt:contains("Speichergeschwindigkeit") + dd
...

这应该可以解决问题，假设选择器在选择器图中是明确的。我建议使用 dl.specification 作为父选择器。

如果任何dt 元素表示在文本输出中不容易捕获的布尔属性，例如当dd 包含不带文本的svg 复选标记时：

dt:contains("Validated")

当行本身的存在是有条件的时，只需检查dt 的存在（省略dd 同级选择器）就可以产生所需的信息。