Playwright库page.evaluate()方法执行JavaScript 表达式

page.evaluate() 方法是 Playwright 中常用的方法之一，用于在页面上下文中执行 JavaScript 代码。它允许在浏览器环境中执行各种操作，如操作 DOM 元素、获取页面数据、执行复杂的计算等，并将结果返回到 Node.js 或 Python 代码中。

在 Playwright 中，page.evaluate() 方法的基本语法如下：

**`result = await page.evaluate(script,` `*args)`**

其中：

script 是一个 JavaScript 字符串，表示要在页面上下文中执行的代码。
args 是可选参数，可以传递给 JavaScript 代码的参数列表。

page.evaluate() 方法会在页面的 JavaScript 环境中执行指定的代码，并返回执行结果。如果代码中有异步操作，您可以使用 await 关键字来等待执行完成。

# 获取页面标题
title = await page.evaluate('document.title')

# 在页面中查找所有链接的数量
links_count = await page.evaluate('document.querySelectorAll("a").length')

# 计算两个数字的和
result = await page.evaluate('(a, b) => a + b', 3, 4)

# 获取页面中某个元素的文本内容
element_text = await page.evaluate('(selector) => document.querySelector(selector).innerText', '.my-element')

page.evaluate() 方法在 Playwright 和 Puppeteer 中的使用方式非常相似，都是用于在页面上下文中执行 JavaScript 代码，并返回执行结果。这使得它成为执行各种操作的强大工具，如数据提取、页面操作、自动化测试等。

`------- evaluate` 方法是 Playwright 库在版本 1.8 中新增的功能，用于在浏览器环境中执行 JavaScript 表达式并获取其结果。它能够处理同步和异步函数，并支持向这些函数传递参数。

主要特点包括：

执行 JavaScript 表达式：您可以将函数或包含 JavaScript 表达式的字符串传递给 page.evaluate() 方法。
处理 Promise：如果传递给 page.evaluate() 的函数返回一个 Promise，则该方法会等待 Promise 解析，并返回其值。
处理非可序列化值：如果函数返回一个非可序列化值，比如函数本身或特殊的数值，如 -0、NaN、Infinity 或 -Infinity，方法会解析为 undefined。不过，Playwright 还支持传输这些额外的值。
传递参数：您可以向 JavaScript 表达式/函数传递参数。这些参数可以作为数组提供，并且可以在表达式内部访问到。
与 ElementHandle 的结合使用：您还可以将 ElementHandle 实例作为参数传递给 page.evaluate()，从而可以直接在浏览器环境中操作 DOM 元素。
自动函数调用：如果表达式评估为一个函数，则 page.evaluate() 会自动调用它。

以下是page.evaluate() 使用方法的示例：

# 传递函数和参数
result = await page.evaluate("([x, y]) => Promise.resolve(x * y)", [7, 8])
print(result)  # 输出: 56

# 传递包含表达式的字符串
print(await page.evaluate("1 + 2"))  # 输出: 3
x = 10
print(await page.evaluate(f"1 + {x}"))  # 输出: 11

# 传递 ElementHandle 实例
body_handle = await page.evaluate("document.body")
html = await page.evaluate("([body, suffix]) => body.innerHTML + suffix", [body_handle, "hello"])
await body_handle.dispose()

在这个例子中：

我们传递了一个函数 (x, y) => Promise.resolve(x * y)，以及参数 [7, 8]，以异步方式计算两个数字的乘积。
我们将简单的算术表达式和变量传递给 page.evaluate()，以在浏览器环境中执行计算。
我们获取 <body> 元素的 innerHTML 并在浏览器环境中与后缀连接起来。

----------

使用 `page.evaluate()` 方法时，您可以利用它来执行各种任务，包括但不限于：

操作 DOM 元素：您可以使用 JavaScript 来查找、修改或操作页面上的 DOM 元素。例如，您可以通过 document.querySelector() 或 document.querySelectorAll() 方法来选择元素，并使用其他 DOM API 来进行操作。
```
# 查找单个元素
element = await page.evaluate('document.querySelector("h1")')

# 查找多个元素
elements = await page.evaluate('document.querySelectorAll("p")')
```

获取页面内容：您可以检索页面的文本内容、属性值、样式信息等。这对于提取页面信息以进行后续分析或操作非常有用。

# 修改元素的文本内容
await page.evaluate('document.querySelector("h1").textContent = "New Heading"')

# 修改元素的样式
await page.evaluate('document.querySelector("p").style.color = "red"')

# 添加类名
await page.evaluate('document.querySelector("div").classList.add("highlight")')

模拟用户操作：您可以执行一系列操作，如点击、填写表单、提交表单等，以模拟用户与页面的交互。这对于自动化测试或爬取动态网页内容非常有用。

# 点击按钮
await page.evaluate('document.querySelector("button").click()')

# 填写表单字段
await page.evaluate('document.querySelector("input[type=\\"text\\"]").value = "John Doe"')

# 提交表单
await page.evaluate('document.querySelector("form").submit()')

# 模拟键盘输入
await page.evaluate('document.querySelector("input[type=\\"text\\"]").value = "Hello, World!"')

执行复杂的计算：如果您需要在页面上执行一些复杂的计算或操作，page.evaluate() 可以帮助您在浏览器环境中执行这些操作，并将结果返回到 Python 代码中。

result = await page.evaluate('''() => {
    // 在页面上执行复杂的计算
    function complexCalculation(a, b) {
        return Math.sqrt(a*a + b*b);
    }
    
    // 调用复杂计算函数
    return complexCalculation(3, 4);
}''')

print("结果:", result)  # 输出: 5

处理页面事件：您可以在页面上触发事件，如点击、拖放、键盘输入等，以测试页面的交互性或模拟用户的操作行为。

# 模拟点击事件
await page.evaluate('document.querySelector("button").click()')

# 模拟键盘输入事件
await page.evaluate('document.querySelector("input").value = "Hello, World!"')
await page.evaluate('document.querySelector("input").dispatchEvent(new Event("input"))')

与页面中的 JavaScript 函数交互：如果页面中定义了 JavaScript 函数，您可以使用 page.evaluate() 来调用这些函数，并传递参数给它们。

#假设页面中有以下 JavaScript 函数：
// 页面中定义的 JavaScript 函数
function greet(name) {
    return "Hello, " + name + "!";
}

#可以使用 page.evaluate() 来调用这个函数，并传递参数给它：
# 在 Python 中调用页面中定义的 JavaScript 函数
result = await page.evaluate('greet("John")')
print(result)  # 输出：Hello, John!

执行页面注入脚本：您可以将自定义的 JavaScript 脚本注入到页面中，以实现特定的功能或修改页面行为。

# 创建新元素并添加到页面中
await page.evaluate('''
    const newElement = document.createElement("div");
    newElement.textContent = "New Element";
    document.body.appendChild(newElement);
''')

# 移除现有元素
await page.evaluate('document.querySelector(".old-element").remove()')

总的来说，page.evaluate() 是 Playwright 中一个非常强大和灵活的方法，可以让您在浏览器环境中执行任意 JavaScript 代码，并与 Python 代码进行交互，从而实现各种复杂的任务。