這是簡易資料分析系列的第 16 篇文章。

這期課程我們講一個用的較少的 Web Scraper 功能——抓取屬性資訊。

網頁在展示資訊的時候，除了我們看到的內容，其實還有很多隱藏的資訊。我們拿豆瓣電影250舉個例子：

電影圖片正常顯示的時候是這個樣子：

如果網路異常，圖片載入失敗，就會顯示圖片的預設文案，這個文案其實就是這個圖片的屬性資訊：

我們檢視一下這個結構的 HTML（檢視方法可見 CSS 選擇器的使用的第一節內容），就會發現圖片的預設文案其實就是這個 <img/> 標籤的 alt 屬性：

我們可以看一下 HTML 文件裡對 alt 屬性的描述：

alt 屬性是一個必需的屬性，它規定在影象無法顯示時的替代文字

在 web scraper 裡，我們可以利用 Element attribute 屬性來抓取這種屬性資訊。

因為這次的內容比較簡單，新建 sitemap 這一步我就先省略了，我們直接上來使用 Element attribute 抓取資料。

我們把 Type 選為 Element attribute，然後用 Selector 選中圖片這個元素：

Element attribute 會多一個選項——Attribute name，我們在這個輸入框裡輸入我們要抓取的屬性名字。

觀察一下這個 img 標籤的屬性，有 alt（替換文字）、width（圖片寬度）和 src（圖片連結）3 種：

這裡我先輸入 alt

，表示抓取圖片的替代文字：

還可以輸入 src，表示抓取圖片的連結：

也可以輸入 width，抓取圖片寬度：

通過 Element attribute 這個選擇器，我們就可以抓取一些網頁沒有直接展示出來的資料資訊，非常的方便。

sitemap 分享

{"_id":"douban2","startUrl":["https://movie.douban.com/top250?start=0&filter="],"selectors":[{"id":"ele","type":"SelectorElement","parentSelectors":["_root"],"selector":".grid_view li","multiple":true,"delay":0},{"id":"image_name","type":"SelectorElementAttribute","parentSelectors":["ele"],"selector":"img","multiple":false,"extractAttribute":"alt","delay":0}]}
 

推薦閱讀

Web Scraper 高階用法——CSS 選擇器的使用 | 簡易資料分析 15

HTML img 標籤的 alt 屬性

聯絡我

因為文章發在各大平臺上，賬號較多不能及時回覆評論和私信，有問題可關注公眾號 ——「鹵代烴實驗室」，（或 wx 搜尋 sky_chx）關注上車防失聯。

相關推薦