Puppeteer筆記（七）：Puppeteer切換浏覽器TAB頁

Puppeteer筆記（七）：Puppeteer切換浏覽器TAB頁

一、Puppeteer切換浏覽器TAB頁

1、browser.pages()

二、上手執行個體Demo

　　功能測試：打開www.ly.com首頁，定位搜尋"蘇州"，擷取新打開頁面上的搜尋結果的第一個名稱，并在終端輸出列印出來。下面列舉了兩種方法供參考。

1 const puppeteer = require('puppeteer');
 2 async function tab() {
 3     //建立一個Browser浏覽器執行個體，并設定相關參數
 4     const browser = await puppeteer.launch({
 5         headless: false,
 6         defaultViewport: null,
 7         args: ['--start-maximized'],
 8         ignoreDefaultArgs: ['--enable-automation']
 9     });
10     //建立一個Page執行個體
11     const page = await browser.newPage();
12     await page.goto("https://www.ly.com", {
13         waitUntil: 'networkidle2'
14     });
15     const searchText = await page.$('#pt__search_text');
16     await searchText.type('蘇州');
17     const searchBtn = await page.$('#pt__search_btn');
18     await searchBtn.click();
19     await page.waitFor(3000);
20     //方法一：browser.pages(),可以擷取所有打開的Page對象，可以通過周遊或篩選找到自己想擷取的Page對象
21     const newPage = (await browser.pages())[2];
22     //方法二：通過browser.waitForTarget擷取target
23     const target = await browser.waitForTarget(t => t.url().includes('https://so.ly.com/hot'));
24     const newPage = await target.page();
25     //擷取搜尋結果清單頁第一個标題的值，并輸出終端
26     const newPageText = await newPage.$eval('div.search_list > ul > li:nth-child(1) > div > a > h3', ele => ele.innerText);
27     console.log('newPageText：' + newPageText);
28     //關閉浏覽器
29     await browser.close();
30 }
31 tab();      

　　注意點：方法一中browser.pages()定位頁面時，周遊時注意頁面是從0開始計數的。是以定位的是第2個頁面。如下圖所示。

　　以上參考代碼運作結果如下