量化通 QuantPass

量化通QuantPass

爬蟲第二步:解析網頁

快速導覽

前言:

嗨各位好,進到第二步驟了,上一篇講完關於網頁的基本架構,這章節就要來講解到底網頁解析長怎樣呢?

之所以需要介紹這個是因為,如果不知道網頁解析長怎樣,就跟去了超市想買4號電池,卻不知道電池到底放在哪、甚至不知道4號電池長怎樣;

但網頁可沒有店員可以告訴你商品在哪邊呢,所以這時候就只能自己去認識網頁內容了!

話不多說,我們直接開始:

第一步:網頁架構一般長怎樣呢?

一般的網頁組成就會長這樣哦!

是不是覺得看不懂?沒關係,讓我們一步一步學習分析!

用顏色區別後還是很亂?讓我們繼續往下看
紅色就是網站文字,粉紅色則是網站最基本的框架長相哦!

只留下紅框跟粉紅框,我們直接看這個簡單的範例:

大家可以清楚看到紅框處其實就很像是正常的文字內容對吧?沒錯,這就是網站上一般會顯示出來的文字囉,爬蟲的目標通常就是這些文字們!

而粉紅框處其實可以看到 ‘head’ ‘body’ 這個頭跟身體的單字,

head 指的其實就是網站頁面的大標框架,就當成是超市的招牌本身吧,告訴你這邊主要就是招牌的鐵架子,放招牌內容的地方,

而當中的title指的就是招牌的名稱囉,例如7-11等等,讓客戶可以一眼就知道這個網站是幹嘛用的,

而body當然就是指超市內的東西啦,

所以其實可以看到除了head內放個title 外,其他都放在body內囉!

再來繼續解析body內的資訊:

聰明的你肯定發現,<名稱>與</名稱>中,後面多了一個斜線 ( / )的符號,

這就是Html中,告訴你上一個<名稱>中的東西,只到</名稱>這邊就算結束囉!

那麼我們就知道,哦~那看一下這當中是不是我們要的東西就可以了,

而比較常見的則有:

  • h2:指的就是標題的大小,通常有h1-h6;
  • p:指的就是最一般的文字
  • a:就是指標籤,通常跟超連結一起出現,底下會說明
  • b:一般常見的是讓文字粗體的意思

 

而當看到 href = “某串東西”時,就表示這邊就是網址囉,例如PCHOME內每個商品頁面其實都會給一個Link,所以如果要爬網址,找關鍵字’href’就可以囉!

這邊的b(粗體)後面又多了 class,這是啥意思呢?

其實就是針對這個內容做的類別,通常是讓該內容可使用CSS的設計,

例如你希望100段文字內,被強調的都轉成紅色、字體都要放大,那你就可以去呼叫那個負責轉成紅色且放大文字的CSS內容,並且套用在你想要的段落上,這樣就不用重複寫囉!

而這個在未來某些狀況下,也是能針對class的內容進行爬蟲的。

今天講了那麼多,對於網站解析有沒有初步認識了呢?

那麼我們下一章節,就要開始講解如何做一個最簡單的爬蟲囉!

量化通是個致力於全民量化金融教育的社群,我們希望透過由淺入深的內容,帶領大家以正確觀念來實踐自動化的金融投資研究分析。內容涵蓋傳統研究分析方法、量化分析、選股、爬蟲、API 串接、回測、以及下單等跨領域多元知識,由各領域專家為大家提供最精闢的內容。

如果覺得我們的文章還不錯,別忘了掃 QR Code 或點擊下方連結,按讚並追蹤量化通的粉專,我們將努力為您奉上每篇精選文章。

◎量化通FB專頁:https://www.facebook.com/QuantPass
◎量化通網站:https://www.quantpass.org
◎學習更多點這裡 → https://lihi1.cc/NVULo

發表迴響

分類
更多文章

聯絡我們