反爬篇 | 手把手教你處理 JS 逆向之 CSS 偏移

#?依賴包
#?bs4?用于對(duì)網(wǎng)頁(yè)源碼的元素樣式進(jìn)行二次更新
pip3?install?beautifulsoup4

#?lxml?用于爬取網(wǎng)頁(yè)數(shù)據(jù)
pip3?install?lxml

import?requests
from?bs4?import?BeautifulSoup

...
url?=?'http://.../flight.html'
resp?=?requests.get(url).text

#?首次解析源碼
soup?=?BeautifulSoup(resp,?"lxml")

#?查詢頁(yè)面中的em元素
em_elements?=?soup.find_all("em",?class_="rel")

#?對(duì)第一個(gè)b標(biāo)簽添加flex的屬性
for?em_element?in?em_elements:
????first_b_element?=?em_element.find_all('b')[0]

????#?添加flex屬性
????first_b_element['style']?=?first_b_element['style']?+?';display:flex;'

#?重新導(dǎo)出進(jìn)行數(shù)據(jù)解析
resp?=?soup.prettify()
...
#?寫入到本地文件查看
#?with?open('temp.html',?'w',?encoding='utf-8')?as?file:
#?????file.write(resp)
...

import?re
from?lxml?import?etree

...
#?數(shù)據(jù)解析
html?=?etree.HTML(resp)

#?查詢有幾個(gè)航班數(shù)據(jù)
div_list?=?html.xpath('//div[@class="left?col-md-9"]/div')
print('航班數(shù)據(jù)數(shù)目：',?len(div_list))

for?index?in?range(len(div_list)):
????#?獲取所有b標(biāo)簽
????b_elements?=?div_list[index].xpath('.//em/b')

????#?從第1個(gè)b標(biāo)簽下面的子標(biāo)簽數(shù)據(jù)?，這樣就可以獲取價(jià)格的位數(shù)（3位、4位）
????price_num_list?=?b_elements[0].xpath('./i/text()')

????print("打底機(jī)票價(jià)格為:",?''.join([item.strip()?for?item?in?price_num_list]))

????#?從第2個(gè)b標(biāo)簽開始，獲取真實(shí)價(jià)格對(duì)應(yīng)的數(shù)字
????for?index,?b_element?in?enumerate(b_elements[1:]):
????????#?數(shù)據(jù)
????????price_num?=?int(b_element.xpath('./text()')[0])
????????#?獲取b標(biāo)簽的style屬性值
????????style?=?b_element.xpath('./@style')[0]
????????#?利用正則表達(dá)式，獲取left屬性值
????????left_value?=?re.findall('left:(.*?)px',?style)[0]
????????#?根據(jù)left值，計(jì)算數(shù)據(jù)在真實(shí)價(jià)格中的索引位置(-1/-2/-3)
????????price_index?=?int(int(left_value)?/?16)

????????#?替換源數(shù)組中的數(shù)據(jù)，按索引將數(shù)值設(shè)置進(jìn)去
????????price_num_list[price_index]?=?price_num

????#?item都轉(zhuǎn)成字符串，合成一個(gè)新的數(shù)組
????price_num_list?=?[str(item).strip()?for?item?in?price_num_list]

????#?組成價(jià)格
????price?=?int(''.join(price_num_list))

????print("機(jī)票價(jià)格:",?price)
...