在处理动态网页内容时，“查看页面源代码”仅显示服务器初始发送的html，不包含javascript渲染后的内容，而“审查元素”则展示了浏览器实时构建的完整dom。因此，若需通过python脚本访问此类动态生成的内容，必须采用selenium或playwright等浏览器自动化工具模拟用户行为，或分析网页请求寻找潜在的api接口，以获取javascript加载后的数据。
动态网页内容解析：’查看页面源代码’与’审查元素’的本质区别
在进行网页数据抓取时，开发者经常会遇到一个困惑：为什么在Google Chrome等浏览器的“审查元素”（Inspect）功能中能看到某个HTML区块的内容，而在“查看页面源代码”（View page source）中却无法找到？这两种查看方式的本质区别在于它们所展示的页面状态。
“查看页面源代码”：此功能显示的是服务器最初发送给浏览器的原始HTML文档。它是一个静态快照，不包含任何由客户端JavaScript执行后对DOM（文档对象模型）进行的修改。如果网页内容是通过JavaScript在浏览器端动态加载或生成的，那么这些内容就不会出现在原始源代码中。
“审查元素”：此功能展示的是浏览器当前渲染的、实时的DOM结构。这意味着它不仅包含了原始HTML，还包含了所有由JavaScript执行后对页面进行的添加、修改或删除。例如，许多现代网站会使用Ajax请求从后端获取数据，然后通过JavaScript将这些数据插入到HTML中，这些动态生成的内容只会在“审查元素”中可见。
因此，当你看到这样的自定义标签或其内部内容只在“审查元素”中可见时，通常意味着这些内容是由页面上的JavaScript脚本动态加载和渲染的。
立即学习“Python免费学习笔记（深入）”；
Python脚本访问动态内容的策略
由于Python的requests库等传统HTTP客户端只能获取到服务器返回的原始HTML，无法执行JavaScript，因此它们无法直接抓取到动态生成的内容。要访问这些内容，我们需要采取以下策略：
1. 使用浏览器自动化工具
Selenium和Playwright是强大的浏览器自动化工具，它们可以驱动真实的浏览器（如Chrome、Firefox）来加载网页、执行JavaScript，并模拟用户与页面的交互。通过这些工具，我们可以等待页面完全加载并渲染出动态内容后，再提取所需数据。
使用Selenium的示例代码：
腾讯云AI代码助手
基于混元代码大模型的AI辅助编码工具
98 查看详情
首先，确保你已安装Selenium库和对应浏览器的WebDriver（例如ChromeDriver）。
pip install selenium# 下载 ChromeDriver: https://chromedriver.chromium.org/downloads# 将 ChromeDriver 放到系统PATH中或指定其路径
然后，可以使用以下Python脚本来抓取动态内容：
from selenium import webdriverfrom selenium.webdriver.common.by import Byfrom selenium.webdriver.support.ui import WebDriverWaitfrom selenium.webdriver.support import expected_conditions as ECimport time# 指定 ChromeDriver 的路径（如果不在系统PATH中）# service = webdriver.ChromeService(executable_path='/path/to/chromedriver')# driver = webdriver.Chrome(service=service)# 初始化 Chrome 浏览器（默认会在系统PATH中查找 ChromeDriver）# 可以选择以无头模式运行，不显示浏览器界面，提高效率options = webdriver.ChromeOptions()options.add_argument('--headless') # 启用无头模式options.add_argument('--disable-gpu') # 禁用GPU加速，在无头模式下通常需要options.add_argument('--no-sandbox') # 解决一些Linux环境下的沙箱问题options.add_argument('--disable-dev-shm-usage') # 解决/dev/shm空间不足问题driver = webdriver.Chrome(options=options)try: url = "https://www.apec.fr/candidat/recherche-emploi.html/emploi?motsCles=photoshop&typesContrat=101888&salaireMinimum=72&salaireMaximum=200&page=0" driver.get(url) # 等待页面加载完成或特定元素出现 # 这里以等待 class 为 'job-offers-list' 的元素出现为例 # 你需要根据实际网页结构调整等待条件 WebDriverWait(driver, 10).until( EC.presence_of_element_located((By.CLASS_NAME, "job-offers-list")) ) # 获取包含动态内容的整个 body 元素的 HTML # 或者更精确地查找目标元素 dynamic_content_html = driver.page_source # 如果目标是特定的 标签内容 # 可以通过 CSS 选择器或 XPath 来查找 apec_offres_element = driver.find_element(By.TAG_NAME, "apec-offres") if apec_offres_element: print("找到 元素。其内部HTML：") print(apec_offres_element.get_attribute("outerHTML")) else: print("未找到 元素。") # 进一步解析提取到的HTML内容，例如使用BeautifulSoup from bs4 import BeautifulSoup soup = BeautifulSoup(dynamic_content_html, 'html.parser') # 示例：查找所有职位列表项 job_items = soup.find_all('div', class_='job-item') # 假设职位列表项的class是'job-item' for job in job_items: title = job.find('h2', class_='job-title').text.strip() # 假设标题在h2标签内 company = job.find('span', class_='company-name').text.strip() # 假设公司名在span标签内 print(f"职位: {title}, 公司: {company}")except Exception as e: print(f"发生错误: {e}")finally: driver.quit() # 关闭浏览器
2. 分析网络请求（API抓取）
在某些情况下，动态内容是通过JavaScript向后端API发送请求并获取JSON或XML数据后渲染的。这种方法通常比浏览器自动化更高效、更稳定。
分析步骤：
打开目标网页，并打开浏览器的开发者工具（F12）。切换到“网络”（Network）选项卡。刷新页面，或触发加载动态内容的操作（如滚动、点击）。观察网络请求，寻找返回JSON或XML数据的XHR/Fetch请求。这些请求通常包含我们所需的数据。一旦找到API接口，你可以直接使用Python的requests库向该接口发送请求，获取原始数据。
示例（伪代码）：
import requestsimport json# 假设通过开发者工具分析，找到了一个返回职位列表的API接口api_url = "https://www.apec.fr/api/jobs" # 这是一个假设的URL，你需要实际分析headers = { "User-Agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.124 Safari/537.36", "Accept": "application/json"}params = { "motsCles": "photoshop", "typesContrat": "101888", "salaireMinimum": "72", "salaireMaximum": "200", "page": "0"}try: response = requests.get(api_url, headers=headers, params=params) response.raise_for_status() # 检查HTTP请求是否成功 data = response.json() # 解析 JSON 数据，提取所需信息 for job in data.get('jobs', []): # 假设JSON中有一个'jobs'列表 print(f"职位: {job.get('title')}, 公司: {job.get('companyName')}")except requests.exceptions.RequestException as e: print(f"API请求失败: {e}")except json.JSONDecodeError: print("API返回的不是有效的JSON格式。")
注意事项与最佳实践
遵守网站规则： 在进行网页抓取前，务必查阅网站的robots.txt文件，了解网站是否允许抓取以及允许抓取的范围。尊重网站的使用条款，避免对服务器造成过大负担。设置延迟： 使用Selenium等工具时，加入适当的等待时间（time.sleep()或WebDriverWait）可以模拟人类行为，避免被网站检测为爬虫。异常处理： 编写健壮的代码，处理网络错误、元素未找到等异常情况。无头模式： 在生产环境中，推荐使用浏览器的无头（headless）模式运行Selenium，这样可以节省系统资源，提高抓取效率。User-Agent： 在发送请求时，设置合适的User-Agent头，模拟真实浏览器访问，可以减少被反爬机制拦截的风险。IP代理： 对于大规模抓取，考虑使用IP代理池来避免IP被封锁。
总结
理解“查看页面源代码”和“审查元素”之间的差异是成功抓取动态网页内容的关键。当内容由JavaScript动态生成时，传统的requests库将无法满足需求。此时，可以利用Selenium或Playwright等浏览器自动化工具模拟真实用户行为，等待页面完全渲染后再提取数据；或者，通过分析网络请求，直接调用网站的后端API来获取数据，这种方法通常更为高效。选择哪种方法取决于网站的复杂性和反爬机制。始终牢记遵守网站的抓取规则，并采取负责任的抓取行为。
以上就是理解动态网页内容：‘查看页面源代码’与‘审查元素’的区别及Python抓取策略的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/291960.html
微信扫一扫 
支付宝扫一扫 
