获取元素文本 puppeteer - Javascript

在使用 Puppeteer 进行 Web 自动化测试时，我们常需要获取网页中的文本信息。下面介绍几种获取元素文本的方法。

使用 page.evaluate()

page.evaluate() 方法可以在浏览器环境中执行 JavaScript 代码，并返回结果，我们可以利用它来获取元素的文本。

const element = await page.$('#selector');
const text = await page.evaluate(element => element.textContent, element);
console.log(text);

使用 page.$$eval()

page.$$eval() 方法可以在浏览器环境中执行 JavaScript 代码，并将指定的元素集合传递给这个函数。我们还可以在这个函数中使用 DOM API 来获取元素文本。

const text = await page.$$eval('#selector', elements => elements.map(element => element.textContent));
console.log(text);

使用 page.$eval()

page.$eval() 方法可以在浏览器环境中执行 JavaScript 代码，选取指定的元素，并返回选取的元素文本。

const text = await page.$eval('#selector', element => element.textContent);
console.log(text);

以上是三种获取元素文本的方法，可以根据需要选择不同的方法。

补充说明

以上代码示例中，需要注意以下几点：

1. page.$(selector) 方法通过 selector 选取符合条件的第一个元素。
2. elements.map() 方法将元素集合中的元素依次传递给函数，并将函数返回值组成新的数组返回。在本例中，通过 elements.map(element => element.textContent) 获取元素的文本。
3. $eval() 方法和 $$eval() 方法的区别在于，前者选取的是符合条件的第一个元素，后者选取的是符合条件的所有元素。