什么时候window.onload被解雇了

Question

什么时候window.onload被解雇了

关于window.onload事件何时被触发,我有点困惑.例如:我有一个页面,其中包含许多外部js文件,甚至是按需加载脚本(动态创建标记).所有这些代码都在页面中(即,它不会在click或smth上被触发,它应该在加载时执行).现在让我们说我在最后一个按需javascript中有window.onload = somefunction().是否有可能在实际加载所有脚本之前触发window.onload？

Answer 1

Aar*_*lla 23

window.onload(aka body.onload)在主HTML,所有CSS,所有图像和所有其他资源都已加载和渲染之后被触发.因此,如果您的图像停滞,可能需要一些时间.

如果您只需要HTML(DOM),则可以使用jQuery $(document).ready()- 它将在解析HTML时触发,但在浏览器完成加载所有外部资源(HTML中脚本元素之后的图像和样式表)之前触发.

当浏览器解析</script>每个脚本时,嵌入在页面中的脚本会被执行.因此,要在任何其他脚本之前执行脚本,请<script>在标题之后添加标记<head>.

这意味着您可以window.onload通过添加<script>标记作为最后一个元素来"模拟" <body>.

@Paul是对的.*window.onload*在浏览器解析`</ html>`时不会触发,它会在下载和渲染所有图像,对象和其他资源时触发.你将它与突变事件*DOMReady*混淆,后者在解析文档时触发.此外,动态添加的脚本元素是异步下载的,因此它们不受此规则的约束. (4认同)

Answer 2

And*_*y E 6

~~号 的window.onload()时,所有的资源(文档,对象,图片,CSS等)已经完成渲染调用.~~

误读了这个问题.是的,完全有可能window.onload事件将在动态附加脚本完成下载之前触发.使用DOM(document.createElement())异步下载添加的脚本,并且不受window.onload()等待所有资源首先完成下载的通常规则的约束.

我为你设置了一个测试套件,http://jsfiddle.net/ywSMW/.此脚本动态地将jQuery脚本添加到DOM,并$在onload处理程序期间将值写入控制台.然后它会在一秒钟之后再次写入该值.即使脚本被缓存,对控制台的第一次写入也会返回undefined,这意味着在下载和解析jQuery脚本之前,onload甚至已经被触发.

在IE和Chrome中测试过.

Re:注释,如果要检查onload事件是否已经触发,可以在onload处理程序中设置全局变量的值:

var windowHasLoaded = false;

window.onload = function () {
    windowHasLoaded = true;
}

function doSomethingWhenWindowHasLoaded() {
    if (!windowHasLoaded) {
        // onload event hasn't fired yet, wait 100ms and check again 
        window.setTimeout(doSomethingWhenWindowHasLoaded, 100);
    } else {
        // onload event has already fired, so we can continue
    }        
}

Run Code Online (Sandbox Code Playgroud)

归档时间：	15 年前
查看次数：	32411 次
最近记录：	6 年，3 月前