python爬虫之初识网页，网页分析法（1），对网页了如指掌的话还怕找不到需要的数据吗？

HTML

【HTML】被称为超文本标记语言，是一种标识性的语言。

它包括一系列标签，通过这些标签可以将网络上的文档格式统一，使分散的【Internet】资源连接为一个逻辑整体。

HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字，图形、动画、声音、表格、链接等。

我们平时网上冲浪，看到的那些五花八门的网站，就是用HTML制作的。。

HTML的组成

能读懂HTML，对我们编写爬虫而言非常重要，因为解析数据、提取网页数据、都需要有一定的TML
下图就是一个基本的HTML文本

这个基础的HTML文本，就像我们盖楼房的地基一样。

万丈高楼平地起的前提，就是一定要做好这个地基。

可以看到，整个HTML文本是由一个个标签组成的，那什么是标签呢？

标签

查看HTML页面时，你应该发现了，里面有很多<>符号，在页面中，由<>组成的字符就叫做标签。

通常情况下一个完整的标签都是由【<开始标签>】和【</结束标签>】组成的。

而结束标签比开始标签多一个反斜杠【/】。

当然也有单标签，例如上图的【】就是一个单标签，还有经常用到的【】标签也是一个单标签。

一般双标签的结构为： <标签>内容

网页头&网页体

在一个网页中，我们所能看到的全部内容，都是编辑在【网页头&网页体】中的。

一个完整的HTML最外层的标签一定是，内部由【网页头&网页体】组成的：

【head】标签中的内容就是【网页头】，【body】标签中的内容就是【网页体】。

图中定义了该HTML文档的字符编码。

定义了网页的标题为Python。

基本标签页：

开发者工具

爬虫作业中，最重要的一步就是提取数据。

我们可以根据HTML结构来分析页面元素进行提取，也可以根据正则表达式提取对应的数据。

分析HTML结构就需要用到浏览器开发人员工具。浏览器开发人员工具可以详细地查看网页布局、请求、响应数据，是爬虫应用中非常实用的工具，也是常用的工具。

下面以Chrome浏览器中的开发人员工具进行讲解， 其他浏览器类似。打开一个网页，按F12快捷键或者右键菜单选择检查

打开Developer Tool,如图所示。

觉得开发者工具位置不舒服可以在右上角的菜单中选择

工具栏，抓包工具

我们可以看到开发者工具主页面中分为上面工具栏和下面信息栏，而上面工具栏又分为几个不同选项

当然，爬虫领域主要需要知道其中四个即可（Elments,Console,Network,Sources），所以以下着重介绍其中四个

Elements

:元素 ⽹⻚源代码，提取数据和分析数据(有些数据是经过特殊处 理的所以并不是都是准确的)
解析显示页面的组成元素，也就是当前看到Chrome渲染页面所需要的HTML、CSS和DOM (Document ObijectModel)对象。此外，还可以编辑这些内容以更改页面显示结果。

选择Elements面板，单击工具栏最左侧的鼠标按钮后，单击页面任意元素，在详情区域会被高亮显示，再次单击可退出模式，如图所示：

在HTML页面中，每个元素,(< div >、< a >)都是一个DOM节点，在单击选择DOM节点的时候，网页中对应的元素也会被高亮显示

如图所示

找到需要抓取的元素，在代码中一般使用CSS与XPath两种方式来实现定位。
在Elments面板中也可以直接复制（copy）路径，如图：

Console

:控制台 (打印信息)
显示各种警告与错误信息，并且提供了Shell用来与文档、开发者工具交互。

Network

: ⽹络⼯作(信息抓包) 能够看到很多的⽹⻚请求
显示当前页面向服务器请求了的资源、资源的大小、加载资源花费的时间以及资源加载是否成功。此外，还可以查看HTTP的请求头、请求参数、响应内容等。

在打开一个网页时，会发起相应的HTTP请求，而Network面板能够监听记录所有的网络访问请求与响应信息，这一点在分析异步加载请求时非常有用。

在Network下，主要又分为Headers，Preview，Response，Timing四个标签页

Headers

而Headers标签中又主要分为三个部分：

General

General: HTTP 请求的基本信息，包括请求地址、请求方法、响应状态码、远程IP、资源访问策略

Response Headers

Response Headers:服务器返回的头部信息，包括连接状态、内容返回类型、时间等信息。

Request Headers

Request Headers: 发起请求的头部信息，包括接受类型、接受语言、连接状态等，需要关注的是User-Agent,某些网站对爬虫类User-Agent会有限制,比如Scrapy框架默认的User-Agent,因此需要对该值进行手动修改。

Preview

Preview标签页对返回的信息进行格式化预览

Response

Response标签页则显示相应的信息

Timing

Timing标签页显示每一步动作所耗费的时间

Sources

:信息来源 (整个⽹站加载的⽂件)
可以在源代码面板中设置断点来调试JavaScript,或者通过Workspaces (工作区)连接本地文件来使用开发者工具进行实时编辑。

Memory

:如果需要比Performance提供更多的信息，可以使用Memory面板，例如跟踪内存泄漏等。

Performance

: 可以通过记录和查看网站生命周期内发生的各种事件来提高页面的运行时性能。

Application

: 检查加载的所有资源，包括IndexedDB与Web SQL数据库、本地和会话存储、Cookie、应用程序缓存、图像、字体和样式表。

Audit

:分析页面加载的过程，进而提供减少页面加载时间、提升响应速度的方案。Security: 安全面板可以调试混合内容问题、证书问题等。