正則表達式從HTML中匹配img標簽的圖片地址
前言
有玩過爬蟲的人應該都有過在又臭又長的HTML中找尋信息的經(jīng)歷,雖然有各種工具和各種框架可以輔助查找,但是解析HTML的規(guī)則也是人想的,制定規(guī)則也是十分麻煩的。
恰好在個人的項目中,需要從某個網(wǎng)站中爬取圖片,好在需求比較簡單,所以試著使用正則表達式來解決。
分析
每個網(wǎng)站中展示圖片的地方,無非就是img標簽或者style中background-image和background,先解決img標簽中的圖片。
首先,地址在標簽的src屬性之中,所以找尋src的位置是必須的。但是不只有img標簽擁有src屬性,video和style也同樣擁有src屬性。因此,只匹配src的位置是不夠,還得確保這個src的位置在img標簽中。
然后,就是匹配src后面的地址,匹配地址的方法已經(jīng)有許多文章描述過了,不再多說,但本文中用了一個比較取巧的方式去匹配。
總的思路就是先匹配src的位置,在獲取圖片地址。
正則表達式
- 首先是匹配src的位置,既然是找位置,那就需要用的正則表達式中預查(?),因為需要的圖片地址是在src后面,所以用反向肯定預查,所以初步確定正則表達式可寫成:
/(?<=判斷條件)/ 至于反向肯定預查的判斷條件,就是在img之后的src,所以正則表達式改成如下: /(?<=(img src="))/ 之所以匹配src=", 是因為想要直接就匹配到地址的開頭位置,于是就順手加上。
但是,因為img和src之間可能還存在class或者其他自定義屬性,所以還要加上這些可能存在字符的匹配。但是因為這些字符的種類比較多,如雙引號"",英文、數(shù)字、甚至是中文等等,一一匹配過于麻煩,有個取巧的方式就是匹配非>。
眾所周知,>在HTML中是一個標簽的結(jié)尾,所以它不可能出現(xiàn)在img標簽內(nèi)的img字符和src字符的中間,所以匹配位置的正則表達式可寫成: /(?<=(img[^>]*src="))/
可以看到,能夠成功找到圖片地址的開頭位置。
- 既然位置找到了,那剩下的就是匹配地址了。這里可以使用其他相關(guān)文章說的匹配地址的正則表達式,但是和上面一樣,同樣可以取巧。
在HTML
標簽中,圖片地址是以雙引號"
開頭和結(jié)尾的,上面的匹配位置已經(jīng)匹配到圖片開頭的雙引號之后,那么圖片地址還剩下一個雙引號,就是結(jié)尾的那個。
那么,直接匹配所有連續(xù)不為"
的字符不就可以了,思路可能有點復雜,但是寫起來簡單:
/[^"]*/
- 因此,總的正則表達式為:
/(?<=(img[^>]*src="))[^"]*/g
結(jié)尾加個g
是表示匹配所有符合條件的字符串,現(xiàn)在就可以匹配出圖片地址了:
總結(jié)
到此這篇關(guān)于正則表達式從HTML中匹配img標簽圖片地址的文章就介紹到這了,更多相關(guān)正則表達式匹配img標簽圖片地址內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!