成為前端工程師｜JavaScript 入門：帶你逐步培養網頁開發技能
從「網頁開發基礎知識」、「JavaScript 語法概念」開始入門，並透過王寧疆老師鉅細靡遺的完整教學，讓你深入了解 JavaScript 的物件、函式設計與應用，以及理解 JavaScript ES6 的版本差異，也經由實作練習累積經驗與穩紮你的基本功。
緯育TibaMe104學習精靈
前端框架開發
前端框架開發
關注
邀請朋友 
Facebook
Line
複製連結
Hi~ 歡迎分享學習資源，有學習問題可匿名向Giver發問！
我要分享
我要提問
前端框架開發 學習推薦
全部
影片
文章
掌握Scrapy框架重要的CSS定位元素方法(下)
Q: Scrapy如何利用CSS方法取得子元素值?
在實務上利用Scrapy框架開發Python網頁爬蟲時，並不是每次想要爬取的網頁元素(Element)都會有CSS樣式類別可以定位，這時候，就會需要透過上層的父元素往下定位子元素。
假設INSIDE硬塞的網路趨勢觀察網站－AI新聞( https://www.inside.com.tw/tag/ai
)的文章標題<a>標籤沒有「js-auto_break_title」CSS樣式類別，而想要爬取<a>標籤的文字內容，該如何達成呢?
這時候，就會需要在Scrapy框架中利用CSS樣式類別先定位到<h3>標籤，接著，再取得其下的子元素<a>標籤，如下範例：
import scrapy
class InsideSpider(scrapy.Spider):
name = 'inside'
allowed_domains = ['www.inside.com.tw']
def parse(self, response):
titles = response.css("h3.post_title a::text").getall()
for title in titles:
print(title)
在範例中，利用「post_title」CSS樣式類別定位到<h3>標籤後，接著一個空白，加上<a>標籤，意思就是取得<h3>標籤下的所有<a>標籤，由於要取得其中的文字，所以加上「::text」。
Q: Scrapy如何利用CSS方法取得元素屬性值?
此外，在開發Python網頁爬蟲時，也有機會爬取元素的屬性值(Attribute)，舉例來說，最常見的就是<a>標籤的href屬性值(Attribute)，也就是文章的連結網址，這時候只需要將「::text」關鍵字，修改為「::attr(屬性名稱)」即可，如下範例：
import scrapy
class InsideSpider(scrapy.Spider):
name = 'inside'
allowed_domains = ['www.inside.com.tw']
def parse(self, response):
urls = response.css("a.js-auto_break_title::attr(href)").getall()
for url in urls:
print(url)
本文與掌握Scrapy框架重要的CSS定位元素方法(上)搭配實際的網站，示範Scrapy框架利用css()方法(Method)來定位網頁元素的基本用法，重點摘要如下：
1.取得單一元素值呼叫get()方法(Method)
2.取得多個元素值呼叫getall()方法(Method)
3.取得文字內容，加上「::text」關鍵字
4.取得屬性值則加上「::attr(屬性名稱)」關鍵字
希望對於想要學習Scrapy框架的朋友有所幫助。
如果想要學習更多的Python應用教學，歡迎前往Learn Code With Mike( https://www.learncodewithmike.com/2021/01/scrapy-css-selectors.html
)網站觀看更多精彩內容。
2
0
322 1
拍手
留言
分享
Line
複製連結
收藏
熱門精選
🔥104人力銀行「2024職涯博覽會」開始報名啦📢
微軟、緯穎、德州儀器、遊戲橘子、東京威力科創、KPMG、IKEA、星巴克、宜得利、迪卡儂等，上百家頂尖知名企業現場徵才🤩
📍 6/15(六) 資訊科技、顧問金融業
📍 6/16(日) 電子製造業、零售服務業
連續兩日，優質企業將在現場釋出數千個工作機會💼
另有中高階獵才、職涯諮詢、趨勢論壇、夜fun職場等系列活動，
主題精采多元，除部分講座收費，其餘活動皆 免費！免費！免費！
1
2
3357 0
拍手
留言
分享
Line
複製連結
收藏
104學習精靈精選課程
看更多課程
想提升職場競爭力？專業技能課程看起來👇
掌握Scrapy框架重要的CSS定位元素方法(上)
想要開發Python網頁爬蟲的朋友，都會知道定位元素(Element)是一個非常重要的動作，Scrapy框架本身就有提供自己的定位元素(Element)方法(Method)，包含CSS與XPath兩種，本文就以INSIDE硬塞的網路趨勢觀察網站－AI新聞( https://www.inside.com.tw/tag/ai
)為例，先來和大家分享在Scrapy框架中，如何利用CSS的定位元素(Element)方法(Method)，爬取想要的網頁內容。
Q: Scrapy如何利用CSS方法取得單一元素值?
CSS(Cascading Style Sheets)階層樣式表相信大家都不陌生，可以自訂樣式的類別來裝飾網頁，像是字體顏色、粗體等，所以在利用Scrapy框架開發網頁爬蟲時，也就能夠利用CSS樣式類別，來定位想要爬取的網頁元素(Element)。
前往INSIDE硬塞的網路趨勢觀察網站－AI新聞，在文章標題的地方，點擊滑鼠右鍵，選擇檢查，可以看到它的CSS樣式類別。假設想要在Scrapy框架中，利用CSS樣式類別來取得網頁的單一元素值，也就是單一文章的標題，就可以在spiders/inside.py的parse()方法(Method)中，使用css()方法(Method)來定位單一元素(Element)，如下範例：
import scrapy
class InsideSpider(scrapy.Spider):
name = 'inside'
allowed_domains = ['www.inside.com.tw']
def parse(self, response):
title = response.css("a.js-auto_break_title::text").get()
print(title)
接著，利用以下的指令執行inside網頁爬蟲：
$ scrapy crawl inside
以上範例，response就是Scrapy框架請求後的回應結果，接著，呼叫css()方法，傳入所要定位的HTML標籤<a>，點的後面加上它的CSS樣式類別，由於要取得元素(Element)的文字，所以在加上「::text」關鍵字，最後，呼get()方法(Method)取得單一元素(Element)。
Q: Scrapy如何利用CSS方法取得多個元素值?
而在Scrapy框架中，想要爬取網頁多個元素值，則呼叫getall()方法(Method)即可，如下範例：
import scrapy
class InsideSpider(scrapy.Spider):
name = 'inside'
allowed_domains = ['www.inside.com.tw']
def parse(self, response):
titles = response.css("a.js-auto_break_title::text").getall()
print(titles)
可以看到getall()方法(Method)回傳的是一個串列(List)，包含了所有樣式類別為「js-auto_break_title」的<a>標籤文字，接下來，利用迴圈即可取得其中的文章標題，如下範例：
import scrapy
class InsideSpider(scrapy.Spider):
name = 'inside'
allowed_domains = ['www.inside.com.tw']
def parse(self, response):
titles = response.css("a.js-auto_break_title::text").getall()
for title in titles:
print(title)
如果想要學習更多的Python應用教學，歡迎前往Learn Code With Mike( https://www.learncodewithmike.com/2021/01/scrapy-css-selectors.html
)網站觀看更多精彩內容。
2
0
175 1
拍手
留言
分享
Line
複製連結
收藏
推薦給你
10個適合用在句首的單字，簡單好記，又有變化！附上例句說明
1. Totally (完全地)：
Totally, I agree with your point of view.
2. Absolutely (絕對)：
Absolutely, we should go with that option.
3. Definitely (肯定地)：
Definitely, let's schedule a meeting for tomorrow.
4. Certainly (當然)：
Certainly, I can help you with that task.
5. Surely (無疑地)：
Surely, you can count on me for support.
6. Indeed (的確)：
Indeed, it was a challenging project.
7. Absolutely (絕對)：
Absolutely, we should proceed with caution.
8. Certainly (當然)：
Certainly, that's a valid point you raised.
9. Definitely (肯定地)：
Definitely, I'll look into it right away.
10. Absolutely (絕對)：
Absolutely, let's aim for excellence in our work.
1
0
461 0
拍手
留言
分享
Line
複製連結
收藏
你可能感興趣的教室