新聞中心
自動腳本沒有想象中那么難,作為一個前端,我們依舊使用我們最擅長的 js 。寫一段需要執(zhí)行的 js 代碼,然后放入到調(diào)試器中回車執(zhí)行,此時我們的自動腳本就能正常跑起來嘍!

成都創(chuàng)新互聯(lián)主要從事網(wǎng)站設(shè)計、成都網(wǎng)站制作、網(wǎng)頁設(shè)計、企業(yè)做網(wǎng)站、公司建網(wǎng)站等業(yè)務(wù)。立足成都服務(wù)乳山,10余年網(wǎng)站建設(shè)經(jīng)驗,價格優(yōu)惠、服務(wù)專業(yè),歡迎來電咨詢建站服務(wù):028-86922220
示例:
沒有寫過自動腳本的前端,趕緊看過來!寫自動腳本常見的幾個問題分別如下:
問題1:獲取到的元素是為 null ?
我們通常直接使用 document.getElementById('btn') 就可以穩(wěn)定地獲取到元素,但是我今天在別人的網(wǎng)站里,審查元素的時候,可以找到 id 為 btn 的元素,但是在調(diào)試器中獲取到的一直是 null 。
現(xiàn)象:document.getElementById('pass-btn') 直接獲取時,返回的是 null ,調(diào)試器中選中元素,然后再獲取元素時,此時獲取到的元素不為空。
原因:檢查頁面結(jié)構(gòu)中是否包含 iframe 結(jié)構(gòu),如果元素是包含在 iframe 引入的外部文件中,就會出現(xiàn)上述問題。
解決辦法:先找到 iframe ,在當(dāng)前對象中查找 DOM
var iframe = window.document.getElementById('myframe')
var test = iframe.contentWindow.document.getElementById('pass-btn')
console.log('-->', test)contentWindow 是一個只讀屬性,返回指定 iframe 的窗口對象,各個瀏覽器均支持。
此時就能很穩(wěn)定的查找到元素了,不需要其他任何操作。
問題2:使用 js 添加的點擊事件無效?
js 中觸發(fā)點擊事件有兩種方式:click 和 onclick 。
現(xiàn)象:自己在本地寫的觸發(fā)點擊事件,使用的 onclick() 在本地示范的時候,可以觸發(fā),沒有任何問題,如:
確定
此時如果換成:
var btn = document.getElementById('btn')
btn.addEventListener('click', () => {
console.log('執(zhí)行')
})
btn.onclick()此時的點擊事件就會失效,運行腳本的時候靜靜躺那不執(zhí)行,我們來看看 click 與 onclick 的區(qū)別?
click 是一個方法, onclick 是一個事件。
方法是寫語句直接調(diào)用,即顯示調(diào)用,可以觸發(fā) onclick 事件,事件一般都以 on 開頭,不需要程序調(diào)用,事件觸發(fā)的函數(shù)會在相應(yīng)的事件觸發(fā)時調(diào)用。
所以寫自動腳本時,使用 click 去調(diào)用,模擬用戶的點擊操作。
問題3:調(diào)試器中斷點如何避開?
有經(jīng)驗的程序員會在項目重要的操作流程中加入 debugger 斷點操作,在不打開調(diào)試器的時候能夠正常運行,打開調(diào)試之后就會出現(xiàn)斷點,阻止我們在調(diào)試器執(zhí)行腳本。我們?nèi)绾魏雎詳帱c呢?
現(xiàn)象:添加 debugger 后,打開調(diào)試模式,程序就會執(zhí)行到斷點時停住,代碼無法繼續(xù)向下執(zhí)行!
解決辦法:禁用所有斷點,如圖所示:
? ?
網(wǎng)站名稱:前端自動腳本中常見的幾個問題,你遇到了嗎?
本文URL:http://fisionsoft.com.cn/article/cosojoc.html


咨詢
建站咨詢
