网页数据抓取怎么写(2.-toggle爬取数据，发现问题元素都选择好了)

　　网页数据抓取怎么写(2.-toggle爬取数据，发现问题元素都选择好了)

　　这是简易数据分析系列文章的第10期。

　　友情提示：这篇文章文章内容很多，信息量很大。希望大家在学习的时候多读几遍。

　　我们在朋友圈刷微博的时候，总是强调“刷”这个词，因为看动态的时候，当内容被拉到屏幕末尾时，APP会自动加载下一页的数据，从体验上来说看，数据将不断加载，永无止境。

　　

　　今天我们要讲的是如何使用Web Scraper来抓取滚动到最后的网页。

　　今天的实践网站是知乎的数据分析模块的精髓。该网站是：

　　

　　这次要刮的内容是精英帖的标题、回答者和点赞数。下面是今天的教程。

　　1.创建站点地图

　　一开始，我们需要创建一个容器，其中收录要捕获的三种数据。为了实现滚动到最后加载数据的功能，我们选择容器的类型为Element scroll down，即滚动到网页底部加载数据。

　　

　　在这种情况下，所选元素被命名为 div.List-item。

　　

　　为了复习上一节中通过数据数控制记录数的方法，我们在元素名后面加上nth-of-type(-n+100)，只有前100条记录暂时捕获。

　　

　　然后我们保存容器节点，在这个节点下选择要抓取的三种数据类型。

　　第一个是标题，我们命名为title，选中的元素命名为[itemprop='知乎:question'] a：

　　

　　然后是响应者姓名和点赞数，选中元素名称为#Popover10-toggle a和button.VoteButton--up：

　　

　　

　　2. 爬取数据，发现问题

　　元素全部选中，我们按照Sitemap 知乎_top_answers->Scrape->Start craping的路径爬取数据，等了十多秒结果出来后，内容让我们傻眼了：

　　

　　数据呢？我要捕获哪些数据？为什么这一切都变成了空？

　　在计算机领域，null一般表示空值，表示什么都没有。当放置在 Web Scraper 中时，这意味着没有捕获任何数据。

　　

　　我们可以回想一下，网页上确实有数据。在整个操作过程中，唯一的变量就是选择元素的操作。因此，一定是我们选择元素时出错，导致内容匹配出现问题，无法正常爬取数据。要解决这个问题，我们需要看一下页面的构成。

　　3.分析问题

　　要查看一个网页的构成，我们需要用到浏览器的另一个功能，就是选择视图元素。

　　1.我们点击控制面板左上角的箭头，此时箭头颜色会变为蓝色。

　　2.然后我们将鼠标移到标题上，标题将被蓝色半透明蒙版覆盖。

　　3.我们再次点击标题，会发现我们会跳转到Elements子面板，内容是一些花哨的代码，很难看懂

　　

　　这里不要害怕，这些HTML代码不涉及任何逻辑，它们只是网页中的一个骨架，提供一些排版功能。如果平时用markdown写，可以把HTML理解为markdown，功能更复杂。

　　结合HTML代码，我们先看一下[itemprop='知乎:question']的匹配规则a。

　　

　　首先这是一个树结构：

　　从可视化的角度来看，上一句其实是一个嵌套结构。我提取了关键内容。内容结构是否清晰得多？

　　

<a>如何快速成为数据分析师？</a>

　　让我们再分析一个获取空标题的标题 HTML 代码。

　　

　　我们可以清楚地观察到，在本题的代码中，缺少名为 div 属性的标签 itemprop='知乎:question'！这样，当我们的匹配规则匹配时，找不到对应的标签，Web Scraper就会放弃匹配，认为找不到对应的内容，所以就变成了null。

　　一旦找到原因，我们就可以解决问题。

　　4.修复问题

　　我们发现，当一个标题被选中时，无论标题的嵌套关系如何变化，总有一个标签是不变的，就是最外层包裹着一个名为class='ContentItem-title的属性的h2标签'。如果我们可以直接选择h2标签，是不是就不能完美匹配标题内容了？

　　逻辑上理清了关系，我们如何操作Web Scraper？这时候我们就可以使用上一篇文章中介绍的内容文章来使用键盘P键选择元素的父节点：

　　

　　在今天的课程中，我们点击 P 键两次来匹配标题的父标签 h2（或 h2.ContentItem-title）：

　　

　　依此类推，因为被访者的名字也出现了null，所以我们分析HTML结构，选择名字的父标签span.AuthorInfo-name。具体分析操作和上面类似，大家可以试试。

　　

　　我的三个子内容的选择器如下，可以作为参考：

　　

　　最后我们点击Scrape爬取数据，查看结果，没有null，完美！

　　

　　5.吐槽时间

　　在爬取知乎数据的时候，我们会发现滚动加载数据很快，但是匹配元素需要很多时间。

　　这间接说明知乎this网站从代码的角度来看还是写得比较差。

　　如果你爬了很多网站，你会发现大部分网页结构都比较“随意”。所以在正式取数据之前，往往需要进行小范围的尝试，比如先取20条记录，看看数据有没有问题。没问题后，可以加一个大范围的正式拉取，一定程度上可以减少返工时间。

　　6.下一期

　　这个问题有很多内容。你可以多读几遍来消化它。下一期我们会讲一些简单的内容，以及如何抓取表格内容。