我使用“waitForSelector”方法，然后尝试获取文本

await page.waitForSelector('your selector')
let element = await page.$('your selector')
let value = await page.evaluate(el => el.textContent, element)

使用waitForSelector和evaluate，这将变得非常干净

const element = await page.waitForSelector('your selector'); // select the element
const value = await element.evaluate(el => el.textContent); // grab the textContent from the element, by evaluating this function in the browser context

我使用Puppeteer和jest从DOM选择中检索值的最简单方法是使用eval方法。
假设我需要一个范围中的文本值。

// markup
<div class="target-holder">
    <span class="target">test</span>
</div>

// inside my e2e test file
const spanVal =  await page.$eval('.target-holder .target', el => el.innerText);

console.log(spanVal); // test

官方文件链接：https://pptr.dev/#?product=Puppeteer&version=main&show=api-pageevalselector-pagefunction-args

如果通过XPath获取元素，只需使用上面的代码。

<span class="toggleable"> Random text.</span> 
// right click on this element -> copy -> copy XPath

const element = await page.$x('//thecopiedxpath');
const textObject = await element[0].getProperty('textContent');
const text = textObject._remoteObject.value;
console.log(text);

这将打印消息“随机文本”。

如果您的目标是接收文本，您可以在DOM页面中使用JS。
更改此内容：

const lis = await page.$$(".data-table > tbody > tr > td");

const appInfo = await page.$("a.icon");

for (const content of lis) {
  const name = await content.$("div.appname");
  const gameName = await page.evaluate(name => name.innerText, name);
  console.log("Game Name: ", gameName);
}

对此：

const appInfo = await page.$("a.icon");

const texts = await page.evaluate(() => {
  const textsToReturn = [];

  const elems = Array.from(document.querySelectorAll('.data-table > tbody > tr > td'));

  for (const el of elems) {
   textsToReturn.push(el.querySelector('div.appname').innerText)
  }

  // If I'm not mistaken, puppeteer doesn't allow to return complicated data structures, so we'll stringify
  return JSON.stringify(textsToReturn)
})

// And here is your game names
console.log('Game names', JSON.parse(texts));

B：由于没有示例，此代码还没有在实际的html页面上进行测试。
但是，您应该了解如何使用DOM原生方法重新实现操纵 puppet 的逻辑，以实现目标。

来自文档：

const tweetHandle = await page.$('.tweet .retweets');
expect(await tweetHandle.evaluate(node => node.innerText)).toBe('10');

//get the xpath of the element
const getXpathOfRecordLabel = await page.$x('//div');

//get the property of textContent
const getTheProperty = await getXpathOfRecordLabel[0].getProperty(
  'textContent'
);

//get the value
const getRecordName = getTheProperty._remoteObject.value;
console.log(getRecordName);

在前端框架如Angular中，通过直接调用来改变DOM是不可取的，因为这些框架需要对DOM进行完全控制才能正常工作。然而，直接操作DOM可能会导致不必要的错误或行为。

**长话短说，**不要用途：

await element.evaluate(el => el.textContent);用于Angular和类似的前端框架/库。

await page.click("input[name=email]", {clickCount: 3})
await page.type("input[name=inputName]", "Input text")