一、Puppeteer切换浏览器TAB页

1、browser.pages()

二、上手实例Demo

  功能测试:打开www.ly.com首页,定位搜索"苏州",获取新打开页面上的搜索结果的第一个名称,并在终端输出打印出来。下面列举了两种方法供参考。

 const puppeteer = require('puppeteer');
async function tab() {
//创建一个Browser浏览器实例,并设置相关参数
const browser = await puppeteer.launch({
headless: false,
defaultViewport: null,
args: ['--start-maximized'],
ignoreDefaultArgs: ['--enable-automation']
});
//创建一个Page实例
const page = await browser.newPage();
await page.goto("https://www.ly.com", {
waitUntil: 'networkidle2'
});
const searchText = await page.$('#pt__search_text');
await searchText.type('苏州');
const searchBtn = await page.$('#pt__search_btn');
await searchBtn.click();
await page.waitFor(3000);
//方法一:browser.pages(),可以获取所有打开的Page对象,可以通过遍历或筛选找到自己想获取的Page对象
const newPage = (await browser.pages())[2];
//方法二:通过browser.waitForTarget获取target
const target = await browser.waitForTarget(t => t.url().includes('https://so.ly.com/hot'));
const newPage = await target.page();
//获取搜索结果列表页第一个标题的值,并输出终端
const newPageText = await newPage.$eval('div.search_list > ul > li:nth-child(1) > div > a > h3', ele => ele.innerText);
console.log('newPageText:' + newPageText);
//关闭浏览器
await browser.close();
}
tab();

  注意点:方法一中browser.pages()定位页面时,遍历时注意页面是从0开始计数的。所以定位的是第2个页面。如下图所示。

  以上参考代码运行结果如下

Puppeteer笔记(七):Puppeteer切换浏览器TAB页的更多相关文章

  1. chrome浏览器tab页内存占用变大,网站变慢为哪般?

    问题概述: 公司做的是BS应用. 之前我们的后台服务器程序是带状态的,用ehcache存储登录状态:这两天被我改成了redis存储,应用本身不再存储登录状态. 然后自测,我在测试某个很耗时间的网页操作 ...

  2. 跨浏览器tab页的通信解决方案尝试

    目标 当前页面需要与当前浏览器已打开的的某个tab页通信,完成某些交互.其中,与当前页面待通信的tab页可以是与当前页面同域(相同的协议.域名和端口),也可以是跨域的. 要实现这个特殊的功能,单单使用 ...

  3. 监听浏览器tab切换

    监听浏览器切屏 为了完成验证用户在切换浏览器tab时进行登录再次认证需求需要监听浏览器切换窗口 if (document.hidden !== undefined) { document.addEve ...

  4. React技巧之处理tab页关闭事件

    原文链接:https://bobbyhadz.com/blog/react-handle-tab-close-event 作者:Borislav Hadzhiev 正文从这开始~ 总览 在React中 ...

  5. 监听浏览器tab选项卡选中事件,点击浏览器tab标签页回调事件,浏览器tab切换监听事件

    js事件注册代码: <script> document.addEventListener('visibilitychange',function(){ //浏览器tab切换监听事件 if( ...

  6. selenium WebDriver 对浏览器标签页的切换

    关于selenium WebDriver 对浏览器标签页的切换,现在的市面上最新的浏览器,当点击一个链接打开一个新的页面都是在浏览器中打开一个标签页,而selenium只能对窗口进行切换的方法,只能操 ...

  7. 小技巧之Selenium如何切换到弹出的Tab页中

    今天群里讨论了一个问题,如何将selenium的操作焦点切换到浏览器中新弹出来的Tab页中,正好对应到了昨天的那篇文章“小技巧之在浏览器中打开新的页签”.今天就带大家来解决这个问题: 先封装一个Tab ...

  8. 制作四个选项卡页 Tab,用户可以通过切换不同的 Tab 页查看不同类别的新闻信息,每个 Tab 有对应的内容版块,点击某个选项卡时,显示对应的内容版块,隐藏其他内容版块,并且为了突出当前的选项卡,还

    查看本章节 查看作业目录 需求说明: 制作四个选项卡页 Tab,用户可以通过切换不同的 Tab 页查看不同类别的新闻信息,每个 Tab 有对应的内容版块,点击某个选项卡时,显示对应的内容版块,隐藏其他 ...

  9. jquery实现tab页切换显示div

    1.jQuery实现tab切换显示代码实现 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" &q ...

随机推荐

  1. 【转载】pyinstaller的使用和几个坑

    1.-w是不显示命令窗口,  -i 图标文件的路径  这是改变图标的,但是我发现只能改变任务栏里的和命令窗口的图标,并不能改变exe文件的图标.另外这些参数要加载pyinstaller和路径中间. 2 ...

  2. [Windows]允许未签名的驱动

    bcdedit.exe -set loadoptions ENABLE_INTEGRITY_CHECKS bcdedit.exe -set TESTSIGNING OFF https://social ...

  3. CodeForces 674C Levels and Regions

    #include<bits/stdc++.h> using namespace std; const int maxn=2e5+5; int N,K,head,tair; int q[ma ...

  4. Linux系统应用管理:增加普通用户(密码管理等)

    1. 查看当前Linux系统的版本.内核等信息 [root@oldboy ~]# cat /etc/redhat-release CentOS release 6.7 (Final) . # 系统版本 ...

  5. 【Linux常见命令】mkdir命令

    mkdir - make directories 例子: mkdir /data 在根目录/下创建data文件夹(目录) 语法: mkdir [-p] dirName 参数说明: -p 确保目录名称存 ...

  6. 利用POI工具读取word文档并将数据存储到sqlserver数据库中

    今天实现了利用POI工具读取word文档,并将数据存储到sql数据库中,代码如下: package word; import java.io.File; import java.io.FileInpu ...

  7. Burnside&Polya总结

    这里就算是一个小总结吧- 附参考的网址: http://blog.sina.com.cn/s/blog_6a46cc3f0100s2qf.html http://www.cnblogs.com/han ...

  8. JAVA学习之路 (五) 类

    java类的学习 先上一个代码 package bankCard; import java.util.Scanner; // 银行卡类 public class bankCard { // 静态变量 ...

  9. 手把手教你用Rancher创建产品质量数据库设置

    目标:在本文中,我们将介绍如何运行一个分布式产品质量数据库设置,它由Rancher进行管理,并且保证持久性.为了部署有状态的分布式Cassandra数据库,我们将使用Stateful Sets (有状 ...

  10. linux和windows互传文件、用户配置文件和密码配置文件、用户组管理、用户管理...

    linux和windows互传文件 第一种:在linux主机上下载lrzsz软件包 1.yum install lrzsz 2.通过rz命令上传window的文件到linux主机上 用过sz 文件名下 ...