Drissionpage實(shí)戰(zhàn)，自動(dòng)登錄后新彈出瀏覽器窗口的處理

天繼續(xù)使用Drissionpage框架來(lái)實(shí)現(xiàn)內(nèi)部系統(tǒng)的網(wǎng)頁(yè)自動(dòng)化處理，編碼過(guò)程中碰到2個(gè)新問(wèn)題，記錄一下解決方法：

自動(dòng)登錄后新彈出瀏覽器窗口的獲取

自動(dòng)輸入賬號(hào)和密碼登錄的代碼非常簡(jiǎn)單，如下所示：

from DrissionPage import WebPage,ChromiumOptions

co=ChromiumOptions()
page=WebPage(chromium_options=co)
page.set.window.max()
page.get("http://xxx:8080")
# 輸入賬號(hào)密碼，自動(dòng)登錄
page.ele("#userName").input("zhangsan")
page.ele("#userPwd").input("123456")
page.ele(".formsubmit").click()
# 點(diǎn)擊待辦任務(wù)圖標(biāo)
page.ele("#daiban").ele("tag:img").click()

但是在系統(tǒng)首頁(yè)面點(diǎn)擊待辦任務(wù)圖標(biāo)時(shí)，一直報(bào)錯(cuò)：無(wú)法定位元素。根據(jù)瀏覽器開(kāi)發(fā)者工具元素定位確認(rèn)沒(méi)有問(wèn)題，調(diào)試跟蹤發(fā)現(xiàn)點(diǎn)擊待辦任務(wù)圖標(biāo)時(shí)page對(duì)象中的html竟然是登錄界面的腳本，才發(fā)現(xiàn)系統(tǒng)首頁(yè)在新彈出的一個(gè)瀏覽器窗口中。

經(jīng)過(guò)多次嘗試，發(fā)現(xiàn)Drissionpage獲取新彈出瀏覽器頁(yè)面page的一種簡(jiǎn)便操作，直接get頁(yè)面的url即可。修改代碼如下：

# 點(diǎn)擊待辦任務(wù)圖標(biāo)
page.get("http://xxx:8080/sword?ctrl=Mh001LoginCtrl_openWin")
page.ele("#daiban").ele("tag:img").click()

具有多個(gè)類的網(wǎng)頁(yè)元素的獲取

另外，在處理具有多個(gè)類的網(wǎng)頁(yè)元素時(shí)，精確匹配類名查找會(huì)定位不到，如以下類名：

class="sGrid_data_row_div  sGrid_data_row_div_dan   "

調(diào)試跟蹤中發(fā)現(xiàn)，類名中間的空格發(fā)生變化導(dǎo)致，查找Drissionpage官網(wǎng)說(shuō)明，有模糊匹配的方法，則可以輕松搞定。

items=page.eles('.:sGrid_data_row_div')

使用過(guò)程中感覺(jué)Drissionpage定位網(wǎng)頁(yè)元素的方法齊全，寫法簡(jiǎn)練。

擊右上方紅色按鈕關(guān)注“小鄭搞碼事”，每天都能學(xué)到知識(shí)，搞懂一個(gè)問(wèn)題！

大家好！我是/小鄭搞碼事/的小鄭

今天和大家分享一下JS如何操作瀏覽器窗口。只講如何打開(kāi)一個(gè)新窗口

先來(lái)看效果圖

上面這個(gè)圖界面效果就是我們要實(shí)現(xiàn)的。

我們常常需要?jiǎng)?chuàng)建一個(gè)新窗口，用來(lái)向用戶顯示額外的信息，同時(shí)又避免他們正在閱讀的信息消失。從實(shí)現(xiàn)方案上來(lái)看，盡管我們可以用HTML打開(kāi)一個(gè)新的瀏覽器窗口，但是使用JavaScript可以對(duì)新窗口的內(nèi)容和特性進(jìn)行更多的控制。

接下來(lái)，我們看一下怎么實(shí)現(xiàn)的

一、定義窗口打開(kāi)函數(shù)

定義一個(gè)打開(kāi)新窗口的函數(shù)newWindow。如上面代碼所示，變量catWindow包含一個(gè)新的窗口對(duì)象，這個(gè)對(duì)象引用圖像文件icon.png，這個(gè)新窗口的名稱是catWin，必須設(shè)置名稱，因?yàn)槲覀円院罂赡芟Ｍ赼或另一個(gè)腳本中引用這個(gè)窗口。新窗口的寬度是350像素，高度是260像素，位置是左邊400，上邊400。

二、寫一個(gè)調(diào)用函數(shù)

頁(yè)面中，包含一個(gè)onload事件處理程序，它調(diào)用newWinLinks函數(shù)，newWinLinks循環(huán)遍歷頁(yè)面上的a，檢查是否有任何a包含class屬性值newWin。如果有，就設(shè)置這個(gè)a元素的onclick事件處理程序，從而，當(dāng)點(diǎn)擊這個(gè)a時(shí)，調(diào)用newWindow函數(shù)。

總結(jié)一下

需要注意兩個(gè)地方：

1、newWindow中，在寬度和高度參數(shù)中的逗號(hào)之間不能有任何空格，如果有空格，那么腳本可能在某些瀏覽器中無(wú)效，總地來(lái)說(shuō)，當(dāng)腳本出現(xiàn)錯(cuò)誤，需要進(jìn)行高度時(shí)，要首先查找這樣的小問(wèn)題。

2、比如向窗口中添加參數(shù)時(shí)，希望窗口具有工具欄，地址欄，滾動(dòng)條

toolbar=yes,location=yes,scrollbars=yes

參數(shù)默認(rèn)是no，可以不填。當(dāng)然瀏覽器上表現(xiàn)也有不同，需要知道。

何網(wǎng)頁(yè)中彈出選項(xiàng)自動(dòng)選擇，比如在看一個(gè)視頻，看完后會(huì)彈出一個(gè)小窗口，需要點(diǎn)擊小窗口中的一個(gè)選項(xiàng)才能繼續(xù)播放下一個(gè)視頻，自動(dòng)化完成這個(gè)動(dòng)作而不需要手動(dòng)點(diǎn)擊

為了實(shí)現(xiàn)這個(gè)功能，可以使用 JavaScript 和瀏覽器的開(kāi)發(fā)者工具。這里是一個(gè)簡(jiǎn)單的步驟，可以幫助實(shí)現(xiàn)自動(dòng)點(diǎn)擊網(wǎng)頁(yè)上的選項(xiàng)。

打開(kāi)需要自動(dòng)化點(diǎn)擊的網(wǎng)頁(yè)。
打開(kāi)瀏覽器的開(kāi)發(fā)者工具。在大多數(shù)瀏覽器中，可以按 F12 鍵或者右鍵單擊頁(yè)面并選擇“檢查元素”。
切換到“Elements”（元素）選項(xiàng)卡，找到彈出窗口中需要自動(dòng)點(diǎn)擊的選項(xiàng)的 HTML 代碼。通常，它會(huì)是一個(gè) <button>、<a> 或 <input> 元素。可能需要等待彈出窗口出現(xiàn)后才能找到相關(guān)元素。
選中該元素，并右鍵單擊，選擇“Copy”（復(fù)制）> “Copy selector”（復(fù)制選擇器）。這將生成一個(gè) CSS 選擇器，用于定位該元素。
切換到“Console”（控制臺(tái)）選項(xiàng)卡，然后輸入以下代碼：

javascript

function autoClick() {
  const selector = 'PASTE_YOUR_CSS_SELECTOR_HERE';
  const button = document.querySelector(selector);
  if (button) {
    button.click();
  }
}

const interval = 5000; // 檢查并嘗試點(diǎn)擊的時(shí)間間隔（毫秒）
setInterval(autoClick, interval);

將 PASTE_YOUR_CSS_SELECTOR_HERE 替換為剛剛復(fù)制的 CSS 選擇器。可以根據(jù)需要調(diào)整 interval 變量的值。

按回車鍵運(yùn)行代碼。這將每隔一段時(shí)間（由 interval 變量確定）嘗試自動(dòng)點(diǎn)擊彈出窗口中的選項(xiàng)。

請(qǐng)注意，這種方法并不適用于所有網(wǎng)站，因?yàn)橛行┚W(wǎng)站可能使用了復(fù)雜的結(jié)構(gòu)或防止自動(dòng)化操作的措施。在這種情況下，可能需要使用更高級(jí)的自動(dòng)化工具，例如 Selenium WebDriver 或 Puppeteer。

在線咨詢

上一篇：重蔚的php學(xué)習(xí)第二天之HTML篇
下一篇：Web前端開(kāi)發(fā)是什么？哪類人適合做Web前端呢？

您的項(xiàng)目需求

*請(qǐng)認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。