首次使用Puppeteer爬虫遇阻：循环点击数组元素获取标题求助

嘿，刚看了你的代码和需求，你现在的写法其实只是直接提取了列表页上那些a[class="Fw(b)"]标签的文本，并没有实现你想要的「点击元素→进入详情页拿标题→返回列表页→继续下一个」的流程——毕竟page.evaluate是在浏览器的沙箱环境里运行的，没法直接和外部的Puppeteer导航API（比如页面跳转、等待加载）配合完成这套操作。

我给你两种靠谱的解决方案，你可以根据目标网站的情况选择：

方案一：先收集所有详情页链接，逐个访问获取标题（更稳定） #

这种方法先把所有要访问的详情页链接一次性收集起来，再逐个跳转获取标题，避免了返回列表页后DOM重新渲染导致元素找不到的问题，稳定性更高。

await page.goto(url);

// 第一步：在浏览器上下文提取所有详情页的链接
const detailUrls = await page.evaluate(() => {
  return Array.from(document.querySelectorAll('a[class="Fw(b)"]')).map(link => link.href);
});

const titles = [];

// 第二步：循环访问每个详情页，获取标题
for (const detailUrl of detailUrls) {
  // 跳转到详情页
  await page.goto(detailUrl);
  // 等待详情页的标题元素加载完成（这里要替换成目标网站实际的标题选择器，比如.h1-title或者其他）
  await page.waitForSelector('h1');
  // 提取标题文本
  const title = await page.$eval('h1', el => el.textContent.trim());
  titles.push(title);
}

await browser.close();
return { titles };

方案二：模拟点击→跳转→返回的完整流程（贴近你的原始想法） #

如果你更想模拟用户手动点击、返回的操作，可以用这种方式，但要注意每次返回列表页后，需要重新定位元素（因为页面跳转后DOM会重新渲染，之前的元素引用会失效）。

await page.goto(url);

// 第一步：先获取列表项的总数
const itemCount = await page.evaluate(() => {
  return document.querySelectorAll('a[class="Fw(b)"]').length;
});

const titles = [];

// 第二步：循环处理每个列表项
for (let i = 0; i < itemCount; i++) {
  // 每次循环重新定位第i+1个元素（因为返回后DOM已刷新）
  await page.waitForSelector('a[class="Fw(b)"]');
  const targetLink = await page.$(`a[class="Fw(b)"]:nth-of-type(${i + 1})`);
  
  // 点击链接并等待页面跳转完成（用Promise.all避免竞态问题）
  await Promise.all([
    targetLink.click(),
    page.waitForNavigation({ waitUntil: 'networkidle2' }) // 等待网络空闲，确保页面加载完成
  ]);
  
  // 获取详情页标题（同样要替换成实际的标题选择器）
  await page.waitForSelector('h1');
  const title = await page.$eval('h1', el => el.textContent.trim());
  titles.push(title);
  
  // 返回列表页并等待跳转完成
  await Promise.all([
    page.goBack(),
    page.waitForNavigation({ waitUntil: 'networkidle2' })
  ]);
}

await browser.close();
return { titles };

几个重要的注意事项： #

• 替换标题选择器：代码里的h1是示例，你需要根据目标网站详情页的实际标题元素调整选择器，比如可能是.article-title、#main-title这类。
• 等待策略：waitForNavigation的waitUntil参数可以选domcontentloaded（DOM加载完成）或networkidle2（网络请求只剩2个以内），根据页面加载情况选择。
• 防反爬处理：如果目标网站有反爬机制，可以在每次跳转后加个短延迟（比如await page.waitForTimeout(1000)），或者设置真实的userAgent，避免被封禁。
• 错误处理：建议给循环加上try-catch块，处理某个页面加载失败的情况，防止整个程序崩溃。

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