Puppeteer中使用.$$eval()爬取数据时遇到的问题

你确实用错了$$eval的用法，同时可能遇到了元素未完全渲染的问题，具体分析和解决方法如下：

• $$eval与$eval的核心区别
  $eval是获取单个匹配元素，回调函数接收的是这个元素本身；而$$eval是获取所有匹配元素的数组，回调函数接收的是元素数组。你之前直接调用words.innerHTML会返回undefined，本质是数组没有innerHTML属性。

• 空数组的原因
  虽然waitForSelector('#words')确保了父元素存在，但#words下的div子元素可能还没完全渲染完成。可以换成等待子元素加载完成后再执行获取操作：

// 等待#words下至少有一个div元素出现
await page.waitForFunction(() => document.querySelectorAll('#words div').length > 0);
const wordsSelector = await page.$('#words');

• 正确的$$eval用法示例
  如果要获取每个div的innerHTML：

const allWordHtmls = await wordsSelector.$$eval('div', divs => 
  divs.map(div => div.innerHTML)
);
console.log(allWordHtmls);

如果要直接提取每个单词的文本（更符合你的需求）：

const allWords = await wordsSelector.$$eval('div', divs => 
  divs.map(div => {
    // 将每个div下的<letter>元素文本拼接成完整单词
    return Array.from(div.querySelectorAll('letter')).map(letter => letter.textContent).join('');
  })
);
console.log(allWords); // 输出类似 ["interest", "test", ...]

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