我想在加载页面时运行一个函数,但我不想在<body>标记中使用它。
我有一个脚本,如果我在<body>中初始化它,就会运行,像这样:
function codeAddress() {
// code
}
<body onLoad="codeAddress()">
但我想运行它没有<body onload="codeAddress()“>和我尝试了很多东西,例如:
window.onload = codeAddress;
但这并不奏效。
那么,当页面加载时,我如何运行它呢?
尝试readystatechange
document.addEventListener('readystatechange', () => {
if (document.readyState == 'complete') codeAddress();
});
状态为:
正在加载—文档正在加载(代码片段中没有触发)
interactive -文档被解析,在DOMContentLoaded之前触发
Complete -在window.onload之前加载文档和资源
<script>
document.addEventListener("DOMContentLoaded", () => {
mydiv.innerHTML += `DOMContentLoaded (timestamp: ${Date.now()})</br>`;
});
window.onload = () => {
mydiv.innerHTML += `window.onload (timestamp: ${Date.now()}) </br>` ;
} ;
document.addEventListener('readystatechange', () => {
mydiv.innerHTML += `ReadyState: ${document.readyState} (timestamp: ${Date.now()})</br>`;
if (document.readyState == 'complete') codeAddress();
});
function codeAddress() {
mydiv.style.color = 'red';
}
</script>
<div id='mydiv'></div>