这可以算是最古老的一类爬虫了，第一代搜索引擎走的就是这条技术路线。互联网的开放性决定了，所有我们能够浏览到的HTML网页的内容，都可以被爬虫抓取到。

静态网页是由简单的 HTML 文本 + JS + CSS 构成的，开发者通常最关心HTML文本，而CSS 和 JS 仍然具有很高的使用频率。通过CSS，我们可以快速定位并提取出所需要的数据，这在后续的数据清洗的时候非常有用，如果没有CSS的id 和 class，唯一可以利用的也许就只有html 的 tag 以及 正则表达式，提取数据的难度会增大很多。至于说通过JS，这是下一个故事了。

以小象官网为例，用一个非常简单的python爬虫就可以获取到。

内容精彩的网页，源代码看起来通常是这个样子，而我们需要的，通常是正文部分的的核心内容，一般通过标签、CSS还有正则，就可以提取出来。实际上，我们可能会遇到各种复杂情况，有些时候我们希望以自动化的方式从中抽取内容，而不用人为地针对每个网页，使用css 等方法来抽取，在公开课里，我们会介绍如何用一些算法，自动识别正文并抽取。

会发现，在原始的 HTML 里就没有显示价格，那么价格数据在哪儿存放呢？我们需要了解的是，在动态页面中，HTML只是一个模板，而页面中的动态信息、数据，都是由程序异步的方式填上去的，这个程序就是java。

在移动互联网时代，HTML 网页所提供的内容已经极大减少了，现在几乎没有哪个主流的应用不支持移动端，倒是有很多应用只有移动端而没有网站，因此当我们需要获取此类应用的数据时，传统的HTML爬虫就不管用了。

这一类应用里，爬虫应用最多的是微信公众号，在公开课里，我会讲到如何抓取微信公众号的数据。

说到微信公众号，我们必须了解的是：移动APP大致可分为两大类应用：H5 应用及原生APP，这两者有什么区别呢？H5的应用本质上是在本地用H5页面进行呈现，也就是说，我们所看到的应用页面本质上是一个网页，比如微信公众号就是这样的，我们所看到的每一篇公众号文章其实就是一个网页，APP 使用内嵌的 WebView 来加载和渲染 HTML 网页，这其实跟浏览器的功能完全一样；另一类就是原生APP了，比如微博的瀑布流，这里用的是native 控件来展示。使用native 控件时，布局都是在程序里预设好的。

上面的截图来自QQ音乐，我们看到的所有蓝色部分都是动态数据，包括中间的音乐专辑封面。这些数据可以是本地的，也可以来自网络请求，如果从网络请求，通常是 HTTP 协议，我们通过抓包工具可以拿到这些数据。

在native app 里，经常也会使用 H5 来渲染，但这跟微信公众号是有区别的。我们知道，HTML相对于普通APP有一个很大的优势，就是复杂元素的布局上，我们可以基于HTML的规则，让浏览器（WebView）动态给元素布局，而在原生APP中，没一个元素的位置摆放，需要程序去设定。所以，对于图文混合的文章来说，使用原生APP 动态解析、布局非常困难，这时交给HTML 网页就简单了。例如上面这篇网易新闻的文章，有标题、图片、文字，每一篇文章的标题文字排版都不同，通过 HTML 技术，简单地使用下面的形式就可以解决，但使用native 的方法则会复杂很多。

这里是一个模板，从原始的 widget 变成了HTML，其中数据部分是单独通过接口获取的，这与微信公众号那一类完全获取整个HTML 仍然有本质的区别，简单说，就是如果抓包的话，我们会看到的微信公众号的数据是网站的HTML 网页，而在网易新闻客户端，通常会看到一个 JSON 格式的响应。

为什么会有这样的区别呢？因为微信公众号是每个公众号平台自己定义的，而网易新闻的文章格式是固定的，所以HTML可以把模板和内容拆开，把模板存储在应用里，而内容则从网络获取，从而大大节省每次网络请求的开销。

APP 里的内容抓取，无论是从内嵌HTML还是纯粹的数据接口，都会比较困难。除了要学会抓包、反编译，通常还要能看懂二进制或者混淆过的Java代码，能从一些蛛丝马迹去寻找我们需要的关键数据。这是为什么呢？因为HTML的解析工作是在浏览器上，浏览器是所有网站共享的，大家必须遵从HTTP 协议以及HTML 的规范，因为这是标准的，也就是开放的，所以各个网站能自定义的东西不多；而APP就不一样了，数据如何传输，如何加密，格式怎么定，都是我自己说了算，不需要也根本就不想让别人能看懂。

除了微信公众号，还会从淘宝、京东、微博这些网站抓取数据，每个网站都有自己的特点，我们应使用不同的方法，例如，针对淘宝和京东，我们可采用动态网页的方式进行抓取；而对于微博，我们则直接分析它的网络请求，找出微博的数据接口，直接通过接口来获取，这个效率比起一般的网络请求 + 解析要快得多。