使用BeautifulSoup爬取页面时class为ng-scope的元素计数为0的问题

我一眼就看出问题所在了——这个页面用了AngularJS渲染内容，ng-scope是Angular给作用域元素自动添加的类。你用requests.get()拿到的只是服务器返回的静态HTML骨架，那些带ng-scope的div是浏览器执行JavaScript后才动态生成的，所以BeautifulSoup在静态源码里根本找不到它们，自然输出0。

下面给你两种可行的解决办法：

方法一：用Selenium模拟浏览器加载动态内容 #

Selenium会启动真实浏览器，等待页面JS执行完成后再获取完整的渲染后源码，这样就能抓到目标元素了。

步骤： #

1. 先安装Selenium：

pip install selenium

2. 下载对应浏览器的WebDriver（比如Chrome的ChromeDriver，要和你的浏览器版本匹配）
3. 修改代码如下：

from bs4 import BeautifulSoup
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

# 初始化浏览器驱动（这里以Chrome为例，确保ChromeDriver路径正确）
driver = webdriver.Chrome()
driver.get("https://www.holonis.com/motivationquotes")

# 等待页面加载完成，比如等待第一个ng-scope元素出现
try:
    WebDriverWait(driver, 10).until(
        EC.presence_of_element_located((By.CLASS_NAME, "ng-scope"))
    )
finally:
    # 获取渲染后的页面源码
    page_source = driver.page_source
    driver.quit()

# 用BeautifulSoup解析源码
soup = BeautifulSoup(page_source, "html.parser")
samples = soup.find_all("div", {"class": "ng-scope"})
print(len(samples))  # 现在应该能输出正确的数量了

方法二：直接请求后端API（更高效） #

模拟浏览器虽然有效，但速度慢。你可以打开浏览器的开发者工具（F12），切换到Network标签，刷新页面后找XHR/fetch请求，看看页面是不是从某个API接口拉取的quote数据。如果能找到对应的API，直接请求这个接口就能拿到结构化数据，比解析HTML高效得多。

比如我查了下，这个页面的quote数据来自内部API接口，你可以直接请求它，然后处理返回的JSON数据，不用管HTML里的ng-scope类。

内容的提问来源于stack exchange，提问作者Rajas Rasam