上一节我们简单讲了一下Scrapy 的安装和使用。在正式开始抓取之前呢，我们先要介绍一些html。磨刀不误砍柴工嘛
HTML 简介
HTML 也就是HyperText Markup Language。中文翻译过来就是超文本标记语言。它与CSS、JavaScript 三者共同构成了仿佛多彩的网页内容。 CSS 是网页的妆容，JavaScript是网页的神经系统，那么HTML就是骨架和血肉了。如果你访问一个网站的时候并没有获取到相应的CSS 和JavaScript 文件，那么你得到的最多就是一个“不好看”的网页。但是并不会影响到信息的获取。这也是互联网最初设计哲学的体现——实现信息的平等交流沟通。 只有信息才是最核心的交流内容。不过现在眼睛被养刁了的我们怕是难以忍受最初的互联网形态了吧。
闲话不多，我们先来看一看最简单的一段HTML 代码吧。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
</body>
</html>
HTML语言之所以突出“标记”二字就是因为基本所有的内容都是储存在一对<>和</>标记之间的。例如其中的<html></html>标签就意味着这之间的内容都是html内容。相应的各种不同的标签都有着不同的语意，例如<a></a>标签的超链接，<ul></ul>标签的列表等等。通过这些标签赋予的不同语意，浏览器会作出不同的解析。
善于观察的你也一定注意到了，这些标签互相之间时存在嵌套的。例如上面的那一段，<head></head>标签就嵌套在了<html></html>标签之内了。这就涉及到我们最重要的一点知识——「html 的树形结构」。
所谓树形结构就是一层接着一层这样，就像一棵树有着树根，枝干，树叶这样的结构。如图所示
HTML结构示意图
想要找到某一个具体的节点就要顺着脉络一层层的向下寻找才行。这就是所谓的DOM(Document Object Model)模型。要让人去在网页中找到某一个信心有时候很容易，因为类似的信息位置都是差不多的，但是要让爬虫来找就需要给出明确的信息才可以哦。
审查元素
对于人来说直接从源代码去查找某个信息的具体位置并不现实，因为没有渲染过的HTML代码实在是不符合人类正常的视觉模式。好在浏览器可以帮到我们大忙。
对于某个特定的元素而言，你只要在它上方点击右键选择审查元素，就可以获得我们下一步工作中需要的信息了。如图所示
firefox中审查元素截图
这样一个节点的信息就一级一级的展示在我们的眼前了。这里我们不光看到了一级一级的标签，还有部分标签属性，下一节我们讲解XPath selector 的时候都会用到哦。
网友评论