人生苦短，我用 Python
前文传送门：
小白学 Python 爬虫（2）：前置准备（一）基本类库的安装
小白学 Python 爬虫（3）：前置准备（二）Linux基础入门
小白学 Python 爬虫（4）：前置准备（三）Docker基础入门
小白学 Python 爬虫（5）：前置准备（四）数据库基础
小白学 Python 爬虫（6）：前置准备（五）爬虫框架的安装
小白学 Python 爬虫（7）：HTTP 基础
先赞后看是个好习惯
网页的组成我们的数据来源是网页，那么我们在真正抓取数据之前，有必要先了解一下一个网页的组成。
网页是由 HTML 、 CSS 、JavaScript 组成的。
HTML 是用来搭建整个网页的骨架，而 CSS 是为了让整个页面更好看，包括我们看到的颜色，每个模块的大小、位置等都是由 CSS 来控制的， JavaScript 是用来让整个网页“动起来”，这个动起来有两层意思，一层是网页的数据动态交互，还有一层是真正的动，比如我们都见过一些网页上的动画，一般都是由 JavaScript 配合 CSS 来完成的。
我们打开 Chrome 浏览器，访问博客站的首页，打开 F12 开发者工具，可以看到：
在选项 Elements 中可以看到网页的源代码，这里展示的就是 HTML 代码。
不同类型的文字通过不同类型的标签来表示，如图片用 <img> 标签表示，视频用 <video> 标签表示，段落用 <p> 标签表示，它们之间的布局又常通过布局标签 <div> 嵌套组合而成，各种标签通过不同的排列和嵌套才形成了网页的框架。
在右边 Style 标签页中，显示的就是当前选中的 HTML 代码标签的 CSS 层叠样式，“层叠”是指当在HTML中引用了数个样式文件，并且样式发生冲突时，浏览器能依据层叠顺序处理。“样式”指网页中文字大小、颜色、元素间距、排列等格式。
而 JavaScript 就厉害了，它在 HTML 代码中通常使用 <script> 进行包裹，可以直接书写在 HTML 页面中，也可以以文件的形式引入。
网页结构我们来手写一个简单 HTML 页面来感受下。
首先创建一个文本文件，将后缀名改为 .html ，名字可以自取，写入如下内容：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Demo</title> </head> <body> <div> <div> <h1>Hello World</h1> <div>Hello Python.</div> </div> </div> </body> </html>首先，整个文档是以 DOCTYPE 来开头的，这里定义了文档类型是 html ，整个文档最外层的标签是 <html> ，并且结尾还以 </html> 来表示闭和。
这里简单讲一下，浏览器解析 HTML 的时候，并不强制需要每个标签都一定要有闭和标签，但是为了语义明确，最好每个标签都跟上对应的闭和标签。各位同学可以尝试删除其中的闭和标签进行尝试，并不会影响浏览器的解析。
整个 HTML 文档一般分为 head 和 body 两个部分，在 head 头中，我们一般会指定当前的编码格式为 UTF-8 ，并且使用 title 来定义网页的标题，这个会显示在浏览器的标签上面。
body 中的内容一般为整个 html 文档的正文，这里小编简单写了几个 div 的嵌套。
这个页面的显示如下：
在 HTML 中，所有标签定义的内容都是节点，它们构成了一个 HTML DOM 树。
根据 W3C 的 HTML DOM 标准，HTML 文档中的所有内容都是节点：
整个文档是一个文档节点
每个 HTML 元素是元素节点
HTML 元素内的文本是文本节点
每个 HTML 属性是属性节点
注释是注释节点
HTML DOM 将 HTML 文档视作树结构。这种结构被称为节点树：
通过 HTML DOM，树中的所有节点均可通过 JavaScript 进行访问。所有 HTML 元素（节点）均可被修改，也可以创建或删除节点。
节点树中的节点彼此拥有层级关系。
父（parent）、子（child）和同胞（sibling）等术语用于描述这些关系。父节点拥有子节点。同级的子节点被称为同胞（兄弟或姐妹）。
在节点树中，顶端节点被称为根（root）
每个节点都有父节点、除了根（它没有父节点）
一个节点可拥有任意数量的子
同胞是拥有相同父节点的节点
下面的图片展示了节点树的一部分，以及节点之间的关系：