Selenium爬取食谱标题部分为空的问题排查与解决

尝试用Selenium爬取allrecipes的鸡肉食谱搜索页标题时，部分标题返回空字符串。

最初使用的代码：

page_url = f'https://www.allrecipes.com/search?{keyword}={keyword}&offset={nb}&q={keyword}'.format(keyword=keyword, nb=nb)

service = Service(ChromeDriverManager().install())
driver = webdriver.Chrome(service=service)

driver.get(page_url)

titles =  [element.get_attribute('data-tag') for element in driver.find_elements(By.CLASS_NAME, "card__content ")]
recipe_links = [element.get_attribute('href') for element in driver.find_elements(By.CSS_SELECTOR, 'a.comp.mntl-card-list-items.mntl-document-card.mntl-card.card.card--no-image')]

print(titles,recipe_links)
driver.quit()

这段代码能提取所有食谱链接，但只有前2个标题正常，其余为空。

改用XPATH定位card__title元素并打印outerHTML时，能看到完整的标题结构：

<span class="card__title">
    <span class="card__title-text ">Chicken Makhani (Indian Butter Chicken)</span>
</span>

需要解决两个问题：

1. 为何部分标题返回空字符串？
2. 如何确保能正确获取第一页的所有标题？

1. 空字符串原因 #

• 你依赖的data-tag属性并非所有card__content元素都具备。前两个食谱卡片属于特殊推荐位，带有该属性，而其他普通卡片的card__content节点没有data-tag属性，调用get_attribute('data-tag')自然返回空。
• 页面加载延迟的可能性较低（你已能打印出完整标题结构），核心原因还是属性本身不存在。

2. 正确获取所有标题的方法 #

直接定位存储标题文本的card__title-text元素，提取其文本内容即可，以下是两种实现方式：

方法一：CSS选择器定位 #

titles = [element.text.strip() for element in driver.find_elements(By.CSS_SELECTOR, ".card__title-text")]

方法二：XPATH定位 #

titles = [element.text.strip() for element in driver.find_elements(By.XPATH, "//span[@class='card__title-text']")]

额外优化：添加显式等待 #

为避免页面未完全加载导致的元素缺失，可增加显式等待确保所有标题元素渲染完成：

from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC

# 最长等待10秒，直到所有标题元素加载完成
WebDriverWait(driver, 10).until(
    EC.presence_of_all_elements_located((By.CSS_SELECTOR, ".card__title-text"))
)

# 再抓取标题
titles = [element.text.strip() for element in driver.find_elements(By.CSS_SELECTOR, ".card__title-text")]

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