前言
大家在学Selenium的时候，对于页面上的有些元素不好操作的时候，可以使用driver.execute_script()方法执行JavaScript脚本。
在Puppeteer中也有类似的方法，使用page.evaluate()执行JavaScript脚本。
page.evaluate()和page.evaluateHandle()之间的唯一区别是page.evaluateHandle()返回JSHandle。
- page.evaluate()：返回调用执行的结果
- page.evaluateHandle()：返回JSHandle
page.evaluate()
此方法返回evaluate() 返回执行JavaScript脚本的结果，使用示例
简单示例：
1 2 | let res = await page.evaluate("1+2");console.log(res); // 输出：3 |
也可以是执行一个函数：
1 2 | let res = await page.evaluate(() => 'Hello World!');console.log(res); // 输出：Hello World! |
函数也可以带上参数：
1 2 | let res = await page.evaluate(([a, b]) => a + b + ' World!', ['Hello ', 'xxx']);console.log(res); // 输出：Hello xxx World! |
如果传递给page.evaluate()的函数返回一个不可序列化的值，则page.evaluate()解析为undefined
【注意】传进去的参数 args 是个数组
1 2 3 4 5 | let companyName = await ChromeHelper.evalJS(function(args) { //【注意】传进来的参数 args 是个数组 return args;}, 'albert');console.log("【公司名】", companyName); |
输出：
1 | 【公司名】 [ 'albert' ] |
操作 web 网页示例
执行document.title获取页面的title
1 2 3 | await page.goto("https://www.baidu.com/");let title = await page.evaluate('document.title')console.log(title); // 输出：百度一下，你就知道 |
登录网站示例
1 2 3 4 5 6 | await page.goto("http://127.0.0.1/login.html");await page.evaluate(function() { document.getElementById('username').value = 'albert'; document.getElementById('password').value = '******'; document.getElementById('loginBtn').click();}) |
page.evaluate()方法一般用于页面上操作元素，无法正常操作的情况，可以用执行JavaScript脚本协助解决。
page.evaluate_handle()返回JSHandle
page.evaluate()和page.evaluateHandle()之间的唯一区别是page.evaluateHandle()返回页内类型(JSHandle)
如果传给此方法的方法（参数）返回的是Promise对象，将等待promise完成并返回其返回值
也可以传一个字符串替代方法：
1 | const aHandle = await page.evaluateHandle('document'); // 'document'对象 |
JSHandle 实例可以作为 page.evaluateHandle的参数：
1 2 3 4 | const aHandle = await page.evaluateHandle(() => document.body);const resultHandle = await page.evaluateHandle(body => body.innerHTML, aHandle);console.log(await resultHandle.jsonValue());await resultHandle.dispose(); |