題圖：by thefolkpr0ject from Instagram
閱讀文本大概需要 4 分鐘。
在《論語》中，孔子提倡“學而不思則罔，思而不學則殆”的學習方法。我們再往深層面挖掘，“思”究竟是在思考什麼？個人理解是思考並總結出一些共性的東西，即“套路”。有套路了，我們學習或工作會更加有效率。
當我們爬取不同的網站是，每個網站頁面的實現方式各不相同，我們需要對每個網站都進行分析。那是否有一些通用的分析方法？我分享下自己爬取分析的“套路”。在某個網站上，分析頁面以及抓取數據，我用得最多的工具是 Chrome 開發者工具。
Chrome 開發者工具是一套內置於 Google Chrome 中的 Web 開發和調試工具，可用來對網站進行迭代、調試和分析。因爲國內很多瀏覽器內核都是基於 Chrome 內核，所以國產瀏覽器也帶有這個功能。例如：UC 瀏覽器、QQ 瀏覽器、360 瀏覽器等。
接下來，我們來看看 Chrome 開發者工具一些比較牛逼的功能。
01
元素面板
通過元素（Element）面板，我們能查看到想抓取頁面渲染內容所在的標籤、使用什麼 CSS 屬性（例如：class="middle"）等內容。例如我想要抓取我知乎主頁中的動態標題，在網頁頁面所在處上右擊鼠標，選擇“檢查”，可進入 Chrome 開發者工具的元素面板。
通過這種方法，我們能快速定位出頁面某個DOM 節點，然後可以提取出相關的解析語句。鼠標移動到節點，然後右擊鼠標，選擇 “Copy”，能快速複製出 Xpath 、CSS elector 等內容解析庫的解析語句。
02
網絡面板
網絡（Network）面板記錄頁面上每個網絡操作的相關信息，包括詳細的耗時數據、HTTP 請求與響應標頭和 Cookie，等等。這就是我們通常說的抓包。
其中的 Filters 窗格，我經常使用其來過濾出一些 HTTP 請求，例如過濾出使用 Ajax 發起的異步請求、圖片、視頻等。
最大的窗格叫 Requests Table，此表格會列出了檢索的每一個 HTTP 請求。 默認情況下，此表格按時間順序排序，最早的資源在頂部。點擊資源的名稱可以顯示更多信息。
- Headers 是顯示 HTTP 請求的 Headers，我們通過這個能看到請求的方式，以及攜帶的請求參數等。
- Preview 是請求結果的預覽。一般用來查看請求到的圖片，對於抓取圖片網站比較給力。
- Response 是請求返回的結果。一般的內容是整個網站的源代碼。如果該請求是異步請求，返回的結果內容一般是 Json 文本數據。
- Cookies 能看到請求攜帶的 Cookies 以及服務器返回的 Cookies。有時候是需要使用到 Response 的 Cookies。例如，某個頁面必須登錄才能看到。