Chrome擴展程序每3秒自動單擊一個按鈕

Question

我正在嘗試構建一個Chrome擴展程序，該擴展程序每3秒自動單擊一個按鈕。

這是我的manifest.json文件：

{ 
    "manifest_version": 2, 

    "name": "Clicker", 
    "description": "My Clicker", 
    "version": "1.0", 

    "content_scripts": [ 
     { 
      "matches": ["<all_urls>"], 
      "js": ["background.js", "arrive.min.js"] 
     } 
    ], 

    "browser_action": { 
     "default_icon": "favicon.ico", 
     "default_popup": "popup.html" 
    }, 
    "permissions": ["activeTab", "tabs"] 
} 

這是我background.js文件：

function myFunc() { 
 
\t document.getElementById('hello').click(); 
 
}; 
 

 
setInterval(myFunc, 3000);

這是我使用的網頁試試看：

<button id="hello" onclick="javascript:alert('hello')">Ciao a tutti</button>

不幸的是，瀏覽器給了我這個錯誤：遺漏的類型錯誤：無法讀取屬性空

的「點擊」爲什麼這是不工作？

Answer 1

您可能試圖訪問元素，然後它存在於dom中。我相信像onload這樣的東西會對此有所幫助，但是由於現代第三方網站不斷重新繪製dom，所以當您去尋找時，您不知道該元素是否準備就緒。我喜歡設置一些幫助者在指定的時間內輪詢所需的元素。以下2個文件是一個完整的工作擴展，當您訪問stackoverflow.com主頁時，會自動點擊您的第一個favorite tag。

編輯：當我第一次發佈這個時，我在比賽中包含了「https://stackoverflow.com/questions」，但是我刪除了它，因爲它太難訪問沒有用最喜歡標籤標記的問題。

---

的manifest.json

{ 
    "name": "my-favorite", 
    "version": "0.0.1", 
    "manifest_version": 2, 
    "description": "Click favorite tag", 
    "homepage_url": "https://github.com/skylize", 
    "content_scripts": [ 
    { 
     "matches": [ 
     "https://stackoverflow.com/" 
     ], 
     "js": ["favorite.js"] 
    } 
    ] 
} 

favorite.js

// Helper to promisify waiting with setTimeout 
// 
function delay (time, ...args){ 
    return new Promise(resolve=> 
    // |0 is just an explicit coercion to int 
    setTimeout(()=>resolve(...args), time|0)) 
} 

// Helper to promisify throwing after timeout 
// 
function timeout (delay, errMsg){ 
    return new Promise((r, reject)=> { 
    setTimeout(()=>{ 
     reject(new Error(errMsg || 'Timed out')) 
    }, delay|0) 
    }) 
} 

function getElementWhenItExists(selector){ 
    // flag to end recursive search if timed out 
    // 
    let keepSearching = true 

    // recursively search for element every 100ms 
    // 
    async function search(){ 
    const node = document.querySelector(selector) 
    if (!node && keepSearching) 
     return await delay(100).then(search) 
    return node 
    } 

    // race search against timeout and return promise with 
    // found node or a timeout error 
    // 
    return Promise.race([ 
    search(), 
    timeout(10000, `Timed out looking for ${selector}`) 
     .catch(e=> { 
     keepSearching = false 
     throw e 
     }) 
    ]) 
} 

const link = getElementWhenItExists('#interestingTags a') 

link.then(a => a.click())