如何抓取JavaScript更新DOM后的页面HTML内容？（延迟10秒左右）

Python实现 #

方案1：Selenium（推荐显式等待） #

如果之前用Selenium没成功，大概率是未等待DOM更新完成就抓取内容。以下是包含可靠等待逻辑的代码：

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
import time

# 初始化Chrome浏览器
driver = webdriver.Chrome()

# 访问目标页面
driver.get("你的目标页面URL")

# 可选：强制延迟10秒（适合明确知道更新时间的场景）
# time.sleep(10)

# 推荐：显式等待目标元素加载（最长等待15秒）
try:
    WebDriverWait(driver, 15).until(
        EC.presence_of_element_located((By.ID, "statisticsContainer"))
    )
except Exception as e:
    print("元素加载超时:", e)

# 获取更新后的完整HTML
updated_html = driver.page_source
print(updated_html)

# 关闭浏览器
driver.quit()

方案2：Pyppeteer #

Pyppeteer是无头Chrome的Python封装，需注意异步语法的正确使用：

import asyncio
from pyppeteer import launch

async def get_updated_dom():
    browser = await launch(headless=True)
    page = await browser.newPage()
    
    await page.goto("你的目标页面URL")
    
    # 可选：强制延迟10秒
    # await asyncio.sleep(10)
    
    # 推荐：等待目标元素出现
    try:
        await page.waitForSelector('#statisticsContainer', timeout=15000)
    except Exception as e:
        print("元素加载超时:", e)
    
    updated_html = await page.content()
    print(updated_html)
    
    await browser.close()

asyncio.run(get_updated_dom())

Node.js实现（Puppeteer） #

使用官方Puppeteer库，逻辑与Python版本一致：

const puppeteer = require('puppeteer');

(async () => {
    const browser = await puppeteer.launch({ headless: true });
    const page = await browser.newPage();
    
    await page.goto('你的目标页面URL');
    
    // 可选：强制延迟10秒
    // await page.waitForTimeout(10000);
    
    // 推荐：等待目标元素加载
    try {
        await page.waitForSelector('#statisticsContainer', { timeout: 15000 });
    } catch (err) {
        console.error('元素加载超时:', err);
    }
    
    const updatedHtml = await page.content();
    console.log(updatedHtml);
    
    await browser.close();
})();

关键注意点 #

• 优先使用等待目标元素出现的逻辑，而非固定延迟，能适配网络波动或JS执行较慢的场景；
• 若必须用固定延迟，确保延迟时间足够覆盖JS渲染DOM的耗时（比如10秒）；
• 检查目标页面是否有反爬机制，部分网站会检测无头浏览器，需添加额外配置（如设置User-Agent）。

内容的提问来源于stack exchange，提问作者Oba Api