有些同学在写爬虫的时候喜欢直接在Chrome开发者工具中复制XPath，如下图：觉得这样复制的XPath虽然有点长，但是正常，所以就用频繁地。但我希望你不要过分依赖这个功能。因为它给出的结果仅供参考，所以有时它不允许您提取数据。让我们看一个例子。这是一个非常简单的HTML页面，其中包含一个名为Phone的列的表。我现在想提取其中的5个调用。如果我们直接使用Chrome的复制XPath的功能，我们可以得到如下的XPath：/html/body/div/table/tbody/tr[3]/td[4]这其实对应的就是刘小三这一行的phone字段。那么，如果我们去掉tr后面的数字，好像可以覆盖所有行：/html/body/div/table/tbody/tr/td[4]/text()在XPathHelper上运行看效果，确实extract出来了所有的电话号码，如下图：但是如果你用requests爬这个网页，然后用XPath来提取电话号码，你会发现什么也提取不出来，如下图下面：你可能会想，这应该是异步加载导致的问题。表格中的数据是通过Ajax后台加载的，不是在网页源代码中加载的。那我们打印一下网页源码看看：可以看到数据在网页源码里，那为什么我们在Chrome上通过XPathHelper可以提取数据，而requests不能提取数据呢？事实上，如果您仔细查看从Chrome复制的XPath，就会发现其中有一个tbody节点。但是我们的网页源码是没有这个节点的。这是关于Chrome开发者工具中显示的HTML代码与网页真实源代码的区别。很多人分不清这两者的区别，所以写出来的XPath无法匹配到数据。我们所说的网页源代码，是指在网页上点击右键，选择“显示网页源代码”按钮，可以查看的HTML代码，如下图：查看页面源代码增长如下图所示：注意地址栏以view-source:开头。这是网页的真正源代码。Element标签在Chrome的开发者工具中显示的源代码是这样的：这两个地方的HTML代码可能是不同的，而在现代网站中，这两个地方的HTML代码很可能是不同的。我们在使用requests或者Scrapy的时候，拿到的是第一种情况的源码，也就是网页真正的源码。开发者工具中的HTML代码是经过Chrome浏览器修改甚至大幅增删的HTML代码。异步加载站点时，JavaScript可以轻松地在此处添加和删除大量内容。即使网站不是异步加载的，如果网站的原始HTML代码不够规范，或者存在一些错误和遗漏，那么Chrome浏览器会自动更正和调整。以本文的例子为例，在官方的HTML规范中，表格的文字确实应该包裹在标签中。但是现在大多数情况下，前端开发者都会省略这个标签，所以真正的源码中是没有这个标签的。而Chrome会自动识别这种情况，然后自动加上这个标签，所以在开发者工具里看到的HTML代码都有这个标签。当你写爬虫的时候，不仅在Chrome开发者工具中复制的XPath仅供参考，就连开发者工具中显示的HTML代码也仅供参考。您应该首先检查您需要的数据是否在真正的源代码中，然后再决定是编写XPath还是捕获接口。如果您正在编写XPath，那么应该以真正的源代码为准，而不是开发人员工具中的HTML代码。本文转载自微信公众号“闻所未闻的密码”，可通过以下二维码关注。转载本文请联系Code公众号。
