上一節(jié)我們簡(jiǎn)單講了一下Scrapy 的安裝和使用。在正式開始抓取之前呢，我們先要介紹一些html存崖。磨刀不誤砍柴工嘛
HTML 簡(jiǎn)介
HTML 也就是HyperText Markup Language静暂。中文翻譯過來就是超文本標(biāo)記語言。它與CSS晦毙、JavaScript 三者共同構(gòu)成了仿佛多彩的網(wǎng)頁內(nèi)容生巡。 CSS 是網(wǎng)頁的妝容，JavaScript是網(wǎng)頁的神經(jīng)系統(tǒng)见妒，那么HTML就是骨架和血肉了孤荣。如果你訪問一個(gè)網(wǎng)站的時(shí)候并沒有獲取到相應(yīng)的CSS 和JavaScript 文件，那么你得到的最多就是一個(gè)“不好看”的網(wǎng)頁须揣。但是并不會(huì)影響到信息的獲取盐股。這也是互聯(lián)網(wǎng)最初設(shè)計(jì)哲學(xué)的體現(xiàn)——實(shí)現(xiàn)信息的平等交流溝通。 只有信息才是最核心的交流內(nèi)容耻卡。不過現(xiàn)在眼睛被養(yǎng)刁了的我們怕是難以忍受最初的互聯(lián)網(wǎng)形態(tài)了吧疯汁。
閑話不多，我們先來看一看最簡(jiǎn)單的一段HTML 代碼吧卵酪。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
</body>
</html>
HTML語言之所以突出“標(biāo)記”二字就是因?yàn)榛舅械膬?nèi)容都是儲(chǔ)存在一對(duì)<>和</>標(biāo)記之間的幌蚊。例如其中的<html></html>標(biāo)簽就意味著這之間的內(nèi)容都是html內(nèi)容。相應(yīng)的各種不同的標(biāo)簽都有著不同的語意溃卡，例如<a></a>標(biāo)簽的超鏈接溢豆，<ul></ul>標(biāo)簽的列表等等。通過這些標(biāo)簽賦予的不同語意塑煎，瀏覽器會(huì)作出不同的解析沫换。
善于觀察的你也一定注意到了，這些標(biāo)簽互相之間時(shí)存在嵌套的。例如上面的那一段讯赏，<head></head>標(biāo)簽就嵌套在了<html></html>標(biāo)簽之內(nèi)了垮兑。這就涉及到我們最重要的一點(diǎn)知識(shí)——「html 的樹形結(jié)構(gòu)」。
所謂樹形結(jié)構(gòu)就是一層接著一層這樣漱挎，就像一棵樹有著樹根系枪，枝干，樹葉這樣的結(jié)構(gòu)磕谅。如圖所示
想要找到某一個(gè)具體的節(jié)點(diǎn)就要順著脈絡(luò)一層層的向下尋找才行私爷。這就是所謂的DOM(Document Object Model)模型。要讓人去在網(wǎng)頁中找到某一個(gè)信心有時(shí)候很容易膊夹，因?yàn)轭愃频男畔⑽恢枚际遣畈欢嗟某幕耄且屌老x來找就需要給出明確的信息才可以哦。
審查元素
對(duì)于人來說直接從源代碼去查找某個(gè)信息的具體位置并不現(xiàn)實(shí)放刨，因?yàn)闆]有渲染過的HTML代碼實(shí)在是不符合人類正常的視覺模式工秩。好在瀏覽器可以幫到我們大忙。
對(duì)于某個(gè)特定的元素而言进统，你只要在它上方點(diǎn)擊右鍵選擇審查元素助币，就可以獲得我們下一步工作中需要的信息了。如圖所示
這樣一個(gè)節(jié)點(diǎn)的信息就一級(jí)一級(jí)的展示在我們的眼前了螟碎。這里我們不光看到了一級(jí)一級(jí)的標(biāo)簽眉菱，還有部分標(biāo)簽屬性，下一節(jié)我們講解XPath selector 的時(shí)候都會(huì)用到哦掉分。
