Page.$$eval() 方法

此方法返回与选择器匹配的所有元素，并将结果数组作为第一个参数传给 pageFunction。

签名

class Page {
  $$eval<
    Selector extends string,
    Params extends unknown[],
    Func extends EvaluateFuncWith<Array<NodeFor<Selector>>, Params> =
      EvaluateFuncWith<Array<NodeFor<Selector>>, Params>,
  >(
    selector: Selector,
    pageFunction: Func | string,
    ...args: Params
  ): Promise<Awaited<ReturnType<Func>>>;
}

参数

参数	类型	说明
selector	Selector	用于在页面中查询的选择器。CSS 选择器可以直接传入，Puppeteer 特有的选择器语法支持按文本、无障碍角色和名称、xpath查询，也支持跨 shadow root 组合这些查询。或者，你也可以使用前缀来指定选择器类型。
pageFunction	Func \| string	将在页面上下文中求值的函数。该函数将收到一个匹配元素数组作为其第一个参数。
args	Params	要传给 `pageFunction` 的任何其他参数。

返回值：

Promise<Awaited<ReturnType<Func>>>

调用 pageFunction 的结果。如果它返回一个元素，则该元素会被包装成 ElementHandle，否则直接返回原始值。

备注

如果 pageFunction 返回一个 Promise，$$eval 将等待该 Promise 兑现，然后返回其值。

示例 1

// get the amount of divs on the page
const divCount = await page.$$eval('div', divs => divs.length);

// get the text content of all the `.options` elements:
const options = await page.$$eval('div > span.options', options => {
  return options.map(option => option.textContent);
});

如果你使用的是 TypeScript，则可能需要为 pageFunction 的第一个参数提供显式类型。默认情况下它的类型为 Element[]，但你可能需要提供更具体的子类型：

示例 2

await page.$$eval('input', elements => {
  return elements.map(e => e.value);
});

编译器应当能够根据你提供的 pageFunction 推断出返回类型。如果无法推断，你可以使用泛型类型告诉编译器你期望从 $$eval 得到什么返回类型：

示例 3

const allInputValues = await page.$$eval('input', elements =>
  elements.map(e => e.textContent),
);