為什么我的onload函數無法在JavaScript中使用？

Question

我正在使用api來生成隨機報價。 其工作正常，但我想在頁面加載后立即生成隨機引號。

document.getElementById('load').addEventListener('onload', loadData);
document.getElementById('getQuote').addEventListener('click', loadData);

    function loadData() {
        const xhr = new XMLHttpRequest();
        xhr.open('GET', 'https://talaikis.com/api/quotes/', true);
        xhr.onload = function() {
            if (this.status === 200) {
                const data = JSON.parse(this.responseText);
                document.getElementById('quote-message').innerHTML = `<h1>${data[0].quote}</h1>`;
                document.getElementById('author').innerHTML = `<h3>${data[0].author}</h3>`;
            }
        }
        xhr.send();
    }

Answer 1

按照頁面加載后執行的JavaScript

使用window.onload在文檔加載時啟動腳本：

window.onload = loadData;

您的完整代碼將如下所示

window.onload = loadData;
document.getElementById('getQuote').addEventListener('click', loadData);

function loadData() {
 // [...]
}

Answer 2

我想你的問題是，為什么頁面加載時函數無法正常工作，請嘗試將函數loadData封裝在$(document).ready() 。 頁面加載完成后，將執行$(document).ready()包含的函數。

編輯：更正未load ， ready感謝。