我想在加载页面时运行一个函数,但我不想在<body>标记中使用它。

我有一个脚本,如果我在<body>中初始化它,就会运行,像这样:

function codeAddress() {
  // code
}
<body onLoad="codeAddress()">

但我想运行它没有<body onload="codeAddress()“>和我尝试了很多东西,例如:

window.onload = codeAddress;

但这并不奏效。

那么,当页面加载时,我如何运行它呢?


当前回答

而不是使用jQuery或window。自jQuery发布以来,原生JavaScript采用了一些很棒的函数。所有现代浏览器现在都有自己的DOM就绪函数,而无需使用jQuery库。

如果您使用本机Javascript,我建议您这样做。

document.addEventListener('DOMContentLoaded', function() {
    alert("Ready!");
}, false);

其他回答

一旦页面加载,函数将运行:

(*your function goes here*)(); 

另外:

document.onload = functionName();
window.onload = functionName(); 

窗口。Onload将像这样工作:

函数codeAddress() { . getelementbyid(“测试”).innerHTML =日期(); } 窗口。onload = codeAddress; <!DOCTYPE html > < html > < >头 <title>learning Java script</title> . < script src = " custom.js " > < /脚本> > < /头 身体< > < p id = "测试" > < / p > <李> abcd李< / > 身体< / > < / html >

尝试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>

而不是使用jQuery或window。自jQuery发布以来,原生JavaScript采用了一些很棒的函数。所有现代浏览器现在都有自己的DOM就绪函数,而无需使用jQuery库。

如果您使用本机Javascript,我建议您这样做。

document.addEventListener('DOMContentLoaded', function() {
    alert("Ready!");
}, false);

采用Darin的答案,但jQuery风格。(我知道用户要求javascript)。

运行的小提琴

$(document).ready ( function(){
   alert('ok');
});​