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 that executes after page load

使用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谢谢。

为什么我的onload函数在JavaScript中不起作用？

2 个答案: