1. 程式人生 > >學習爬蟲前對網頁進行認識

學習爬蟲前對網頁進行認識

關系 一次 cal -c 原始的 CA 標簽 高亮 爬蟲

前言

  首先我們提到爬蟲,我們不得不說網頁,因為我們使用python編寫的爬蟲實際上是針對於網頁進行設計的,解析網頁以及抓取這些數據是爬蟲需要做的事情,日常中我們看到這些網頁,可以看到很多圖片,很多的標題以及很多的文字信息,實際上他們都是在瀏覽器渲染後的結果,我們可以吧瀏覽器理解為一個翻譯官,它把這些原始的信息,原始的網頁的代碼翻譯成一些我們可視化的元素。

通過網頁看源碼

  為了可以使我們更形象化的看一下,我們可以在網頁空白處右鍵,點擊檢查,這時候我們都可以看到網頁的源代碼,還有一欄是css樣式,這些我們先不進行講解,我們先看一下,在網頁上的每一個標簽,文字,或者圖片都對應著一段代碼,我們點擊右邊一欄左上角的箭頭符號,我們可以試著點擊一個圖片,可以看到源碼的地方高亮處了一塊,這裏面包含了這個圖片的連接。

技術分享圖片

  實際上這些代碼又分成三個部分,第一部分就是有html組成的這個結構部分,有很多帶標簽的像divsection等都是由html語言寫成的,例如我們看到一個標簽後面跟著一個class,實際上這個是標簽對應的樣式,也就是在最右側這一欄,就是樣式,每次加載網頁都會有這兩個,信息,一個是html一個css樣式,然後在源碼的最低側,還有一個script標簽,這個裏面加載的是javascript代碼,這三者,就是htmlcssjavascript就構成了一個絕大多數網頁的結構,接下來我們就舉一個例子。

HTML

  這三者的關系就好比我們住的房間,其中html就相當於房間中的結構部分,用於區分哪一塊哪一塊具體是做什麽用的,比如一個房子中客廳,臥室的區別。

技術分享圖片

CSS

css部分就相當於我們房間的裝修,它是一個樣式,它決定了墻壁是什麽顏色的,房頂是怎麽樣的,對我們的結構加以裝飾。

技術分享圖片

JAVASCRIPT

-avascript部分你可以把它理解為這是房間中的電器的一些功能,電視點燈之類的。

技術分享圖片

  我們學習網絡爬蟲,實際上很多網頁中的元素是加雜在htmlcss中的,所以針對於爬蟲的話,javascript可能涉及比較少。所以我們這一次就簡單的對html以及css進行介紹。

首先我們在剛才的例子中,我們可以看到了網頁中用到了很多很多這個div標簽。

技術分享圖片

  這個<div>標簽代表的是網頁中的一個區域的意思,這個區域代表著我在這個區域能裝什麽東西,做一個形象的比喻,當有一個div的標簽,那麽在網頁之中就對應著他存在的一塊區域,有了固定區域之後,需要在裏面加一些內容 ,例如我們看到的圖片,標題。我們可以對標簽進行套嵌,可以在div中添加一部分文字,例如一個<p>標簽,但是網頁不可能這麽簡陋,我們需要加上這個css的樣式進行修飾,然後這個就是我們網站的html以及css的基本用法。我們可以知道,這<div>標簽可以在裏面添加內容,而這個標簽是一個區域框架。

  還有一些常見的例如 <li>這個是列表,就是我們日常生活中12345的那個列表,還有就是<img>,使用這個標簽之後你就可以插入一張圖,再有就是h1h1h6是代表著不同字號的標題

  <a href=‘#’>我們可以在網頁中看到夾雜了很多連接,實際上使用這個標簽把它連接起來的,實際這些簡單的標簽可以構成了一個簡單的網頁,學習網站最好的方法莫過於去寫一個網站,這裏就不再帶著大家進行網頁的編寫了,自己可以去了解一下。

  我自己有寫過網頁的博客,大家可以去學習一下https://www.cnblogs.com/liudi2017/p/7614919.html。

學習爬蟲前對網頁進行認識