如何在Puppeteers .evaluate（）方法中传递函数？

[每当我尝试传递一个函数时，就像这样：

var myFunc = function() { console.log("lol"); };

await page.evaluate(func => {
 func();
 return true;
}, myFunc);

我得到：

(node:13108) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: Evaluation failed: TypeError: func is not a function
at func (<anonymous>:9:9)
(node:13108) DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

为什么？如何正确执行？

谢谢！

€：让我澄清一下：我这样做是因为我想先找到一些DOM元素，然后在该函数内部使用它们，就像这样（简化）：

var myFunc = function(element) { element.innerHTML = "baz" };

await page.evaluate(func => {
  var foo = document.querySelector('.bar');
  func(foo);
  return true;
}, myFunc);

伪造者issue中已经讨论过类似的问题。

有几种方法可以解决您的问题。首先要保持简单。

评估功能

这是最快的处理方式，您只需传递函数并执行它即可。

await page.evaluate(() => {
  var myFunc = function(element) { element.innerHTML = "baz" };
  var foo = document.querySelector('.bar');
  myFunc(foo);
  return true;
});

预先暴露功能

您可以使用page.evaluate或page.addScriptTag预先公开该函数

// add it manually and expose to window
await page.evaluate(() => {
  window.myFunc = function(element) { element.innerHTML = "baz" };
});

// add some scripts
await page.addScriptTag({path: "myFunc.js"});

// Now I can evaluate as many times as I want
await page.evaluate(() => {
  var foo = document.querySelector('.bar');
  myFunc(foo);
  return true;
});

使用ElementHandle

page。$（selector）

您可以传递元素句柄进行.evaluate并根据需要进行更改。

const bodyHandle = await page.$('body');
const html = await page.evaluate(body => body.innerHTML, bodyHandle);

page。$ eval

您可以定位一个元素并根据需要进行更改。

const html = await page.$eval('.awesomeSelector', e => {
e.outerHTML = "whatever"
});

技巧是read the docs，保持简单。