R 中的 Web Scraping - 选择正确的 CSS 选择器/类或 HTML 元素答案

【问题标题】：Webscraping in R - choosing the right CSS selector/class or HTML elementR 中的 Web Scraping - 选择正确的 CSS 选择器/类或 HTML 元素
【发布时间】：2021-07-27 10:04:46
【问题描述】：

我很难理解如何选择正确的元素来抓取我所寻找的信息。为此，我使用编程语言 R。

许多教程指导您浏览www.imdb.com 网站那里的结构很容易理解，选择的元素也更直观......但是看看其他网站，这变得更加棘手。

喜欢房地产网站： https://www.immobilienscout24.at/regional/steiermark/graz-stadt/immobilie-mieten 我想从下一个按钮中提取链接。

有没有直接的方法来做到这一点？我确实使用“鼠标右键 - insepct”的东西...... 然后我复制 css-selector： #root > section > section > section:nth-child(1) > section._1NnXN > ul > li._1QVg8 > a

如何快速决定选择哪个元素？

非常感谢，纳丁

【问题讨论】：

学习一些基本的 html，然后阅读 this 并使用 this 练习，然后您可以学习指定自己的模式，包括减少右键单击复制选择器为您提供的内容。

标签： html r web-scraping

【解决方案1】：

这并不容易，但有一些技巧

寻找“人类”技巧

例如，如果您要从页面获取价格，请打开页面源（cmd + option + u on mac使用 chrome）和 cmd + f 表示“价格”这个词 - 运气好的话，制作该网站的 Web 开发人员可能已经编写了代码专门针对价格的 css 类，这使得它真的很容易获得！（这需要一些运气，但值得一试）。

电子商务网站的一些常见名称是“产品”、“价格”、“图片”、“规格”等。

使用浏览器插件

其中一个最受欢迎的是SelectorGadget。您只需打开它，将鼠标移到任何元素上，单击它，它就会为您提供该元素的 xpath。

从高层开始HTML 元素，然后一直往下走，直到找到你想要的东西

如果其他方法失败，请从页面的主要部分之一开始，然后慢慢地对选择器中的元素/类添加更多细化，直到到达您想要查看的元素。

例如，假设页面由这个简单的 HTML 组成：

<html>
  <head>
  </head>
  <body>
    <div class="jumbotron">
      <div class="product">
        <div class="image">
          <img src="/images/product_10.png">
        </div>
        <div class="price">
          $22
        </div>
      </div>
    </div>
  </body>
</html>

并说我们想得到价格。我们可以看到在 HTML 的顶部（在开始的“body”标签内），有一个 div，然后是另一个 div，所以我们可以像这样沿着这条链向下工作：


raw_html <- '<html>
  <head>
  </head>
  <body>
    <div class="jumbotron">
      <div class="product">
        <div class="image">
          <img src="/images/product_10.png">
        </div>
        <div class="price">
          $22
        </div>
      </div>
    </div>
  </body>
</html>'

library(rvest)
library(tidyverse)


page_html <- read_html(raw_html)
page_html %>% 
  html_nodes("div")
# {xml_nodeset (4)}
# [1] <div class="jumbotron">\n      <div class="product">\n        <div class="image">\n          <img src="/images/product_10.png">\n</div>\n        <div cla ...
# [2] <div class="product">\n        <div class="image">\n          <img src="/images/product_10.png">\n</div>\n        <div class="price">\n          $22\n    ...
# [3] <div class="image">\n          <img src="/images/product_10.png">\n</div>
# [4] <div class="price">\n          $22\n        </div>

# Narrowing down
page_html %>% 
  html_nodes("div div")

# {xml_nodeset (3)}
# [1] <div class="product">\n        <div class="image">\n          <img src="/images/product_10.png">\n</div>\n        <div class="price">\n          $22\n    ...
# [2] <div class="image">\n          <img src="/images/product_10.png">\n</div>
# [3] <div class="price">\n          $22\n        </div>

# ..getting closer..
page_html %>% 
  html_nodes("div div div.price")
# {xml_nodeset (1)}
# [1] <div class="price">\n          $22\n        </div>

page_html %>% 
  html_nodes("div div div.price") %>% 
  html_text %>% 
  trimws
# [1] "$22"

然后我们以价格（或我们想要的任何其他元素）结束。

【讨论】：

值得在浏览器的“查找”框中添加，您也可以测试修改后的 css 选择器。更好的是安装一个扩展，它允许您快速关闭 JS，以便您可以针对 rvest 实际返回的内容运行 css 选择器。 IMO，选择器小工具过于冗长，但作为起点很有用。
@stevec：感谢您提供的所有信息！这很有帮助！