我正在执行一个外部脚本,使用<脚本>内<头>。

现在,由于脚本在页面加载之前执行,我不能访问<body>等。我想在文档被“加载”(HTML完全下载并在ram中)后执行一些JavaScript。是否有任何事件,我可以挂钩到当我的脚本执行,这将在页面加载触发?


当前回答

看钩文件。jQuery $(document).load(…)

其他回答

使用YUI库(我喜欢它):

YAHOO.util.Event.onDOMReady(function(){
    //your code
});

便携又漂亮!然而,如果你不把YUI用于其他东西(参见它的文档),我会说它不值得使用。

注意:要使用此代码,您需要导入2个脚本

<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/yahoo/yahoo-min.js" ></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/event/event-min.js" ></script>

看钩文件。jQuery $(document).load(…)

JavaScript

document.addEventListener('readystatechange', event => { 

    // When HTML/DOM elements are ready:
    if (event.target.readyState === "interactive") {   //does same as:  ..addEventListener("DOMContentLoaded"..
        alert("hi 1");
    }

    // When window loaded ( external resources are loaded too- `css`,`src`, etc...) 
    if (event.target.readyState === "complete") {
        alert("hi 2");
    }
});

jQuery也一样:

$(document).ready(function() {   //same as: $(function() { 
     alert("hi 1");
});

$(window).load(function() {
     alert("hi 2");
});


注意:不要使用下面的标记(因为它会覆盖其他同类声明):

document.onreadystatechange = ...

您可以在特定的脚本文件上编写函数,并使用onload属性将其调用到body元素中。

示例:

<script>
  afterPageLoad() {
   //your code here
}
</script>

现在调用你的脚本到你的html页面使用script标签:

<script src="afterload.js"></script>

融入你的身体元素;像这样添加onload属性:

<body onload="afterPageLoad();">

我建议使用asnyc属性的脚本标签,这有助于你加载页面加载后的外部脚本

<script type="text/javascript" src="a.js" async></script>
<script type="text/javascript" src="b.js" async></script>