首先咱們來講說css選擇器；其實在上面的概述：和scrapy相關的函數就這麼三個而已：response.css("css表達式")、extract()、extract_first()。有變化的就是：css表達式的寫法，這裏咱們就列舉一些常見的表達式，雖然不能囊括100%的爬取任務，但能夠很負責的說，至少能夠囊括90%的爬取，這裏小編會把常見的給諸位列舉哈，諸位見相似的即可直接依葫蘆畫瓢使用了。按照HTML標籤的結構能夠分爲：標籤屬性值提取、標籤內容提取，咱們分別介紹對應的狀況；css
一、標籤屬性值的提取
href的值URL的提取：這是最多見的，咱們要進入下一頁、或是打開內容頁……都少不了URL值，以下面這段HTML，咱們來提取一下里面的URLhtml
<ol class="page-navigator">
<li class="current"><a href="http://lab.scrapyd.cn/page/1/">1</a></li>
<li><a href="http://lab.scrapyd.cn/page/2/">2</a></li>
<li><a href="http://lab.scrapyd.cn/page/3/">3</a></li>
<li><a href="http://lab.scrapyd.cn/page/4/">4</a></li>
</ol>
這實際上是咱們爬蟲實驗室的分頁，若是咱們要爬取下一頁，咱們該如何提取URL呢？提取屬性咱們是用：「標籤名::attr(屬性名)」，好比咱們要提取url表達式就是：a::attr(href)，要提取圖片地址的表達式就是：img::attr(src)……以此類推，好了知道scrapy給咱們提供的提取變了的工具，那咱們就能夠提取上面的URL了，有多種方式，首先咱們能夠直接：shell
response.css("a::attr(href)")
而後，咱們調試一下，看是否是咱們想要的結果，cmd輸入：bash
scrapy shell lab.scrapy.cn
而後咱們發現結果並不是是咱們想要的分頁URL，而是頁面中全部的URL：scrapy
Out[3]:
['http://lab.scrapyd.cn/',
'http://lab.scrapyd.cn/archives/57.html',
'http://lab.scrapyd.cn/tag/%E8%89%BA%E6%9C%AF/',
'http://lab.scrapyd.cn/tag/%E5%90%8D%E7%94%BB/',
……
'http://lab.scrapyd.cn/page/1/',
'http://lab.scrapyd.cn/page/2/',
……
'http://lab.scrapyd.cn/page/6/',
'http://lab.scrapyd.cn/page/2/',
'http://lab.scrapyd.cn/tag/%E4%BA%BA%E7%94%9F/',
……
'http://lab.scrapyd.cn/tag/%E5%90%8D%E7%94%BB/',
'http://lab.scrapyd.cn/tag/%E7%94%9F%E6%B4%BB/',
……
'http://lab.scrapyd.cn/']
這固然不是咱們想要的，咱們想要的只是分頁的URL，那這要怎麼辦？那咱們就須要限定一下咱們URL的範圍，最好的方法就是找到咱們要提取目標最近的class或是id，能夠看到這段代碼中有個class="page-navigator"，那咱們就能夠這樣來寫：函數
response.css(".page-navigator a::attr(href)").extract()
當這樣限定以後，咱們發現這就成功提取了咱們想要的URL，灰常的完美！隨便解釋哈上面的：.page-navigator，其中點表明class選擇器，若是代碼中是：id=「page-navigator」，那咱們這裏就要寫成：「#page-navigator」，你們若是不清楚能夠去這裏看看：https://www.runoob.com/css/css-id-class.html；
再來一個提取標籤屬性的栗子，最多見的就是咱們的圖片地址，也就是要提取圖片的src值，以下面網頁：工具
<article class="post" itemscope="" itemtype="http://schema.org/BlogPosting">
<h1 class="post-title" itemprop="name headline"><a itemprop="url" href="http://lab.scrapyd.cn/archives/57.html">中國傳世名畫</a></h1>
<div class="post-content" itemprop="articleBody">
<p>看官，此頁面只爲爬蟲練習使用，都是殘卷，若喜歡能夠去找點高清版！</p>
<p><img src="http://lab.scrapyd.cn/usr/uploads/2018/02/3875934880.jpg" alt="1.jpg" title="1.jpg"></p>
<p><img src="http://lab.scrapyd.cn/usr/uploads/2018/02/2269613152.jpg" alt="2.jpg" title="2.jpg"></p>
<p><img src="http://lab.scrapyd.cn/usr/uploads/2018/02/2360992798.jpg" alt="3.jpg" title="3.jpg"></p>
<p><img src="http://lab.scrapyd.cn/usr/uploads/2018/02/2239103416.jpg" alt="4.jpg" title="4.jpg"></p>
<p><img src="http://lab.scrapyd.cn/usr/uploads/2018/02/4145232684.jpg" alt="5.jpg" title="5.jpg"></p>
</div>
<p itemprop="keywords" class="tags">標籤: <a href="http://lab.scrapyd.cn/tag/%E8%89%BA%E6%9C%AF/">藝術</a>, <a href="http://lab.scrapyd.cn/tag/%E5%90%8D%E7%94%BB/">名畫</a></p>
</article>
這個頁面是咱們爬蟲實驗室：http://lab.scrapyd.cn/archives/57.html的文章，咱們要提取裏面圖片的地址供scrapy下載，有上面的基礎就很簡單了：首先找到隔img最近的class或id，能夠看到有個：class="post-content"，因而咱們能夠這樣寫表達式：post
response.css(".post-content img::attr(src)").extract()
調試的話本身試哈，通過這個表達式：".post-content img::attr(src)，能夠看到已經成功提取出來：ui
Out[2]:
['http://lab.scrapyd.cn/usr/uploads/2018/02/3875934880.jpg',
'http://lab.scrapyd.cn/usr/uploads/2018/02/2269613152.jpg',
'http://lab.scrapyd.cn/usr/uploads/2018/02/2360992798.jpg',
'http://lab.scrapyd.cn/usr/uploads/2018/02/2239103416.jpg',
'http://lab.scrapyd.cn/usr/uploads/2018/02/4145232684.jpg']
好了上面即是提取標籤屬性的方法，利用的就是：標籤名::attr(屬性名)，關鍵點就是如何縮小範圍！url
二、標籤內容的提取
設麼是標籤內容，好比：
<p>scrapy中文網</p>
<div>scrapy中文網：www.scrapyd.cn</div>
<h1>scrapy實驗室：lab.scrapyd.cn</h1>
<title>scrapy中文網</title>
上面標籤：p、div、h1裏面的文字即是標籤內容，那咱們要如何提取呢？用到了scrapy給我提供的這麼一個方法：「::text」，好比要提取上面p標籤裏面的內容，咱們能夠這樣：
response.css("p::text").extract()
那接下來咱們就演示哈如何提取scrapy中文網：http://www.scrapd.cn的title：
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Scrapy 中文網</title>
提取方式：
response.css("title::text").extract()
上面的這個栗子灰常簡單，應爲tittle標籤是頁面惟一的標籤，因此在title前不用加什麼限制，當你發現標籤不惟一的時候，咱們就須要縮小範圍，原理和上面標籤屬性提取同樣，要麼找最近的class、要麼找最近的id，而後最終縮小提取訪問，這樣就能讓提取很準確，以下面這個例子：
<div class="left">
scrapy中文網左邊
</div>
<div class="center">
scrapy中文網中部
</div>
<div class="right">
scrapy中文網右側
</div>
若是咱們要提取第二個div裏面的內容，咱們確定不能這樣：
response.css("div::text").extract()
若是這樣提取的話，咱們確定得不到正確的結果，咱們還須要限制哈範圍，找到最近的class=「center」，最終表達式以下：
response.css(".center::text").extract()
這樣的話就能正確提取咱們想要的內容；下面咱們再介紹一個最經常使用的提取方式：含有嵌套標籤文字的提取，HTML以下：
<div class="post-content" itemprop="articleBody">
<p>若是你因失去了太陽而流淚，那麼你也將失去羣星了。 <br>
If you shed tears when you miss the sun, you also miss the stars.
</p>
<p>
<a href="http://www.scrapyd.cn">scrapy中文網（</a><a href="http://www.scrapyd.cn">http://www.scrapyd.cn</a>）整理
</p>
</div>
若是咱們要提取class=「post-content」裏面的全部文字，咱們須要怎麼辦呢？顯然上面的知識沒法作到。這段文字是scrapy實驗室：http://lab.scrapyd.cn/archives/28.html 裏的文章，諸位能夠scrapy shell進行驗證結果，能夠記住用下面的方式：
response.css(".post-content *::text").extract()
能夠看到，「::tex「t前面有個「*」號，這是一個小技巧，通常人我都告訴他，學着點！好了，上面的一些常見的內容已經說了些；接下來咱們來講一些比較複雜的表達式，你們根據狀況使用：
三、CSS 高級用法：
CSS選擇器用於選擇你想要的元素的樣式的模式。"CSS"列表示在CSS版本的屬性定義（CSS1，CSS2，或對CSS3）。