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 表达式并获取其结果。它能够处理同步和异步函数,并支持向这些函数传递参数。

主要特点包括:

  1. 执行 JavaScript 表达式:您可以将函数或包含 JavaScript 表达式的字符串传递给 page.evaluate() 方法。

  2. 处理 Promise:如果传递给 page.evaluate() 的函数返回一个 Promise,则该方法会等待 Promise 解析,并返回其值。

  3. 处理非可序列化值:如果函数返回一个非可序列化值,比如函数本身或特殊的数值,如 -0NaNInfinity-Infinity,方法会解析为 undefined。不过,Playwright 还支持传输这些额外的值。

  4. 传递参数:您可以向 JavaScript 表达式/函数传递参数。这些参数可以作为数组提供,并且可以在表达式内部访问到。

  5. 与 ElementHandle 的结合使用:您还可以将 ElementHandle 实例作为参数传递给 page.evaluate(),从而可以直接在浏览器环境中操作 DOM 元素。

  6. 自动函数调用:如果表达式评估为一个函数,则 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() 方法时,您可以利用它来执行各种任务,包括但不限于:

  1. 操作 DOM 元素:您可以使用 JavaScript 来查找、修改或操作页面上的 DOM 元素。例如,您可以通过 document.querySelector()document.querySelectorAll() 方法来选择元素,并使用其他 DOM API 来进行操作。

    # 查找单个元素
    element = await page.evaluate('document.querySelector("h1")')# 查找多个元素
    elements = await page.evaluate('document.querySelectorAll("p")')
    
  2. 获取页面内容:您可以检索页面的文本内容、属性值、样式信息等。这对于提取页面信息以进行后续分析或操作非常有用。

    # 修改元素的文本内容
    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")')
    
  3. 模拟用户操作:您可以执行一系列操作,如点击、填写表单、提交表单等,以模拟用户与页面的交互。这对于自动化测试或爬取动态网页内容非常有用。

    # 点击按钮
    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!"')
    
  4. 执行复杂的计算:如果您需要在页面上执行一些复杂的计算或操作,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
    
  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"))')
    
  6. 与页面中的 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!
  7. 执行页面注入脚本:您可以将自定义的 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 代码进行交互,从而实现各种复杂的任务。

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/783109.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

JAVAEE之网络原理

1.IP地址 IP地址主要用于标识网络主机、其他网络设备&#xff08;如路由器&#xff09;的网络地址。简单说&#xff0c;IP地址用于定位主机的网络地址。 格式 IP地址是一个32位的二进制数&#xff0c;通常被分割为4个“8位二进制数”&#xff08;也就是4个字节&#xff09;&…

每日一题(leetcode331):验证二叉树的前序序列化——栈

类似消消乐&#xff0c;数字&#xff0b;“#”“#”就可以消成一个“#”&#xff0c;到最后如果栈中只剩一个“#”便说明序列正确。 当然也可以用槽位理解&#xff0c;一个数字出现会消耗一个槽位产生两个槽位&#xff08;即产生一个槽位&#xff09;&#xff0c;一个“#”出现…

企业防止数据泄露的措施有哪些?(企业机密文件防泄密解决方案)

企业防止数据泄露的措施是一个复杂且关键的问题&#xff0c;涉及到企业的核心竞争力和信息安全。 随着信息技术的快速发展&#xff0c;数据泄露事件频发&#xff0c;给企业带来了巨大的经济损失和声誉损害。 企业防止数据泄露的措施有哪些? 首先&#xff0c;企业需要建立健全…

递归的三种选数

/* 指数型枚举&#xff08;每个数有选和不选两种情况&#xff09; #include<bits/stdc.h> using namespace std; const int N20; int n; int st[N];//记录每个数的状态&#xff0c;0还没有考虑&#xff0c;1表示选这个数&#xff0c;2表示不选这个数 void dfs(int x){/…

雷卯有多种接口与电源保护方案

在当今的电子设备中&#xff0c;各种接口和电源保护至关重要。它们不仅关乎设备的正常运行&#xff0c;更直接影响到数据传输的稳定性和设备的安全。雷卯公司以其专业的技术和丰富的经验&#xff0c;为您提供全面的接口与电源保护方案&#xff0c;确保您的系统安全稳定运行。 …

【Vue面试题】v-show和v-if有什么区别?使用场景分别是什么?

# 一、v-show与v-if的共同点 我们都知道在 vue 中 v-show 与 v-if 的作用效果是相同的(不含v-else)&#xff0c;都能控制元素在页面是否显示 在用法上也是相同的 <Model v-show"isShow" /> <Model v-if"isShow" />当表达式为true的时候&…

Android vehicle车辆属性新增demo

目录 前言一、Vehicle模块1.1 简介1.2 Vehicle框架1.3 主要功能和特点1.4 重要服务CarService1.4.1 简介1.4.2 组成1.4.3 启动时序1.4.4 作用 二、车辆属性新增demo2.1 CarPropertyService2.1.1 简介2.1.2 架构2.1.3 车辆属性 API2.1.4 CarPropertyService 初始化流程 2.2 App …

学习鸿蒙基础(9)

目录 一、鸿蒙国际化配置 二、鸿蒙常用组件介绍 三、鸿蒙像素单位介绍 四、鸿蒙布局介绍 1、Row与Column线性布局 2、层叠布局-Stack 3、弹性布局 4、栅格布局 5、网格布局 一、鸿蒙国际化配置 base目录下为默认的string。en_US对应美国的。zh_CN对应中国的。新增一个s…

Backend - gitea 首次建库(远端本地)

目录 一、建立远端储存库 1. 进入新增画面 2. 填写储存库名称&#xff08;如book&#xff09;&#xff0c;点击“建立”即可 二、本地关联远端储存库 1. 本地初始化储存库代码 &#xff08;1&#xff09;新建文件夹 &#xff08;2&#xff09;获取远端储存库 2. 本地编写…

阿基米德分牛问题及其Python求解

文章目录 题目大意sympy求解结果 题目大意 问 太阳神有一牛群&#xff0c;由白、黑、花、棕四种颜色的公、母牛组成&#xff0c;其间关系如下&#xff0c;求每种牛的个数。 公牛中&#xff0c;白牛多于棕牛&#xff0c;二者之差为黑牛的 1 2 1 3 \frac{1}{2}\frac{1}{3} 21​…

sql查询语法

单表查询 格式 select 字段列表 from 表明列表 where 条件列表 group by 分组字段列表 having 分组后的条件列表 limit 起始索引 每一页的数据量 基本查询 select 字段1&#xff0c;字段2&#xff0c;字段3 from 表名&#xff1b; select * from 表名&#xff1b; select 字段…

SpringBoot 集成分布式任务调度 XXL-JOB【保姆级上手】

文章目录 XXL-JOB 介绍分布式任务调度XXL-JOB 概述 快速入门下载源码初始化调度数据库编译源码调度中心调度中心介绍配置调度中心部署调度中心集群部署调度中心&#xff08;可选&#xff09;Docker 镜像方式搭建调度中心&#xff08;可选&#xff09; 执行器执行器介绍添加依赖…

机器学习-关联规则算法Apriori及编码实现

一、前置知识 在了解关联规则之前首先了解一些相关概念&#xff0c;包含项集、频繁项集、支持度、置信度、提升度等基础概念。假如我们在经营一家商品超市&#xff0c;顾客进行购买商品的订单信息如下&#xff1a; TID ItemsT1 {耳机&#xff0c;背包}T2{背包&#xff0c;手…

外包干了5天,技术退步明显.......

先说一下自己的情况&#xff0c;大专生&#xff0c;18年通过校招进入杭州某软件公司&#xff0c;干了接近4年的功能测试&#xff0c;今年年初&#xff0c;感觉自己不能够在这样下去了&#xff0c;长时间呆在一个舒适的环境会让一个人堕落! 而我已经在一个企业干了四年的功能测…

JAVA面试大全之基础篇

目录 1、语法基础 1.1、面向对象特性?​​​​​​​ 1.2、a = a + b 与 a += b 的区别

发掘服务器硬件优势:怎样有效管理、维护、更新

1. 概述 服务器是许多信息技术的核心&#xff0c;通过提供计算和存储资源&#xff0c;以用于企业和机构的数据处理和存储。服务器硬件也是服务器的核心组成部分&#xff0c;在服务器架构和配置中扮演着重要角色。 服务器硬件的优势&#xff1a; - 提供更高的性能和处理能力。…

meanshift论文学习

1. abstract 2. 理论解读 目标函数 然后对(11)求导&#xff0c;求解x&#xff0c;x实际就是求解当图像位置的值&#xff0c;求导之后表示为&#xff1a; 进一步整理得&#xff1a; 上式第二项即为meanshift 进一步整理为 上式表明了均值漂移与核函数之间的关系。 3. 缺点…

AI预测福彩3D第22弹【2024年3月31日预测--第4套算法重新开始计算第8次测试】

昨天周六单位事情比较多&#xff0c;忙了一天&#xff0c;回来比较晚了&#xff0c;实在没有闲暇时间去做预测了&#xff0c;先给各位道个歉。今天上午比较忙&#xff0c;下午有点空&#xff0c;趁这个时间赶紧把预测的结果发出来供大家参考。 今天继续对第4套算法进行测试&…

阿里云的服务码获取的申请按钮怎么是灰色的

您好&#xff0c;您目前已经进入阿里云备案工单服务渠道&#xff0c;很高兴为您服务。工单渠道的服务响应时效为0-90分钟&#xff0c; 如您所遇到的问题比较着急&#xff0c;您可以通过阿里云官网右上角联系我们中的“在线服务”进行咨询&#xff0c;我们会第一时间为您服务。感…

CentOS7 磁盘相关的命令及磁盘重新调整分配

umount 在CentOS 7中&#xff0c;umount是一个常用的命令&#xff0c;用于卸载文件系统。以下是一些常用的umount命令&#xff1a; 卸载指定的文件系统&#xff1a; umount /dev/sdXN 其中&#xff0c;/dev/sdXN是你想要卸载的分区。例如&#xff0c;/dev/sda1。 卸载并…