bs4 可以解析带有 <style='display：none;>?

Question

如果你https://weathernews.jp/s/topics/201808/220015/?fm=tp_index浏览这个页面，当我把它解析为代码时，你会有两个图像：

from selenium import webdriver
from bs4 import BeautifulSoup
from selenium.webdriver.chrome.options import Options
from urllib.parse import urljoin
import re
options = Options()
options.add_argument("--headless")
driver = webdriver.Chrome(chrome_options=options)
driver.get('https://weathernews.jp/s/topics/201808/220015/?fm=tp_index')
soup_level2 = BeautifulSoup(driver.page_source, 'lxml')
sections = soup_level2.find_all("img")
for section in sections:
image = re.findall(r"(https://smtgvs.weathernews.jp/s/topics/img/[0-9]+/.+)?[0-9]+", urljoin('https://weathernews.jp/', section['src']))
if image:
print(image[0])
else:
image = re.findall(r"(https://smtgvs.weathernews.jp/s/topics/img/[0-9]+/.+)?[0-9]+", urljoin('https://weathernews.jp/', section.get("data-original")))
if image:
print(image[0])

我得到的图片如下

https://smtgvs.weathernews.jp/s/topics/img/201808/201808220015_top_img_A.jpg
https://smtgvs.weathernews.jp/s/topics/img/201808/201808220015_box_img0_A.jpg
https://smtgvs.weathernews.jp/s/topics/img/201808/201808220015_box_img1_A.jpg
https://smtgvs.weathernews.jp/s/topics/img/201808/201808220015_box_img2_A.jpg
https://smtgvs.weathernews.jp/s/topics/img/201808/201808220015_box_img5_A.png

事实上，页面上还有另外两张带有style="display: none;"的图像，你能帮我解析它们吗？

<section id="box3" class="nodisp_zero" style="display: none;">
<h1 id="box_ttl3" style="display: none;"></h1>
<img style="width: 100%; display: none;" id="box_img3" alt="box3" src="https://smtgvs.weathernews.jp/s/topics/img/dummy.png" class="lazy" data-original="https://smtgvs.weathernews.jp/s/topics/img/201808/201808220015_box_img3_A.jpg?1533975785">
<figcaption id="box_caption3" style="display: none;"></figcaption>
<div class="textarea clearfix">
<h2 id="box_subttl3" style="display: none;"></h2>
<div class="fontL" id="box_com3" style="display: none;"></div>
</div>
</section>

Answer 1

您可以使用属性查询 html。

前任：

html = """<section id="box3" class="nodisp_zero" style="display: none;">
<h1 id="box_ttl3" style="display: none;"></h1>
<img style="width: 100%; display: none;" id="box_img3" alt="box3" src="https://smtgvs.weathernews.jp/s/topics/img/dummy.png" class="lazy" data-original="https://smtgvs.weathernews.jp/s/topics/img/201808/201808220015_box_img3_A.jpg?1533975785">
<figcaption id="box_caption3" style="display: none;"></figcaption>
<div class="textarea clearfix">
<h2 id="box_subttl3" style="display: none;"></h2>
<div class="fontL" id="box_com3" style="display: none;"></div>
</div>
</section>"""

from bs4 import BeautifulSoup
soup = BeautifulSoup(html, "html.parser")
print( soup.find("section", {"style": "display: none;"}).img["data-original"] )

输出：

https://smtgvs.weathernews.jp/s/topics/img/201808/201808220015_box_img3_A.jpg?1533975785