怎麼做靜態爬蟲??

今天時做的是靜態爬蟲，所謂靜態爬蟲就是爬一筆靜態的網頁，所謂靜態網頁就是HTML就寫在那邊，我們就可以用靜態爬蟲來獲取我們想要的資源。

今天試爬:

https://www.banking.gov.tw/ch/home.jsp?id=60&parentpath=0,4&mcustomize=FscSearch_BankSub.jsp&bank_no=005&title=%E6%9C%AC%E5%9C%8B%E9%8A%80%E8%A1%8C

怎麼打開網頁控制台?爬蟲可以爬甚麼?

可以用快捷鍵F12或是右鍵點擊檢查，之後選取Console即可進入控制台。

可以爬所有的內容，有一個select的技巧，在剛剛點開的頁面中點左上角的符號，就會在element中選到你所click的位置

選好想選的位置後，在該element中點左鍵找到copy>>copy JS path

就可以直接選到這個元素的絕對位置

JS的selector要如何使用?

剛剛上一個章節，我們有copy JS path，可以把它paste在console就可以選擇到剛剛我們選的這個內容，結果會長的像下方這樣。

document.querySelector("#maincontent > div:nth-child(1) > div.whitebackground0 > table > tbody > tr:nth-child(2) > td")

<td class="fsright">臺灣土地銀行股份有限公司</td>

括號中也可以用Css selector的方式寫:

document.querySelector("div.whitebackground0 .fsright")
<td class=​"fsright">​005​</td>​

他會選到返回第一個府和select條件的結果

如果要選全部符合的可以這麼寫

document.querySelectorAll("div.whitebackground0 tr")
NodeList(9) [tr, tr, tr, tr, tr, tr, tr, tr, tr]

可以選到所有的結果，至於要將選到的內容全都印出來可以這麼做...

選好了那內容怎麼輸出呢?

使用foreach的概念，將選到的項目，逐筆的選到想選的位置輸出

for (const item of items) {
    const title = item.querySelector('.fsleft').textContent.trim()
    const value = item.querySelector('.fsright').innerHTML.trim()
    console.log(title)
    console.log(value)
}