`
踏月流星
  • 浏览: 1579 次
  • 性别: Icon_minigender_1
  • 来自: 北京
最近访客 更多访客>>
文章分类
社区版块
存档分类
最新评论

对onload和addEvent执行顺序的分析

阅读更多
1、测试过的浏览器有:火狐4、谷歌浏览器、ie6、ie7、ie8、ie9。
2、在以上任何一种浏览器中都会最先执行ready,这是因为ready在等页面的结构(即:dom)加载完成之后,就已经开始执行了,而另外两种方法,是要等页面中的所有内容(包括:图片和js等)下载完成之后,才会执行。
3、onload和addEvent在火狐4、谷歌和ie9中的执行顺序取决于:它们在页面代码中的先后次序。也就是说:这两种方式谁在代码中的顺序比较靠前,就会先执行哪个方法。
4、onload和addEvent在ie6、ie7、ie8中的执行顺序始终为:先执行addEvent,然后执行onload。
5、如果在页面的body标签中添加了onload方法,则其执行顺序为:
为了方便叙述,A代表ready,B代表window.onload,C代表body中的onload方法,D代表addEvent。
(1)B和C方法在所有浏览器中都会相互覆盖掉对方,也就是说:谁写在页面的前边,就会在后面被对方给覆盖掉。
(2)如果B在C后面:在火狐、ie6、ie7、ie8、ie9中的执行顺序为:A、B、D。C方法不会执行。
                       在谷歌浏览器中的执行顺序为:A、D、B。C方法不会执行。
                                             
(3)如果C在B后面:在火狐、谷歌浏览器、ie9中的执行顺序为:A、D、C。B方法不会执行。
                       在ie6、ie7、ie8浏览器中的执行顺序为:A、C、D。B方法不会执行。
分享到:
评论

相关推荐

    同时使用n个window onload加载实例介绍

    总之,`window.onload`是用于确保页面完全加载后执行特定操作的关键事件,通过自定义的`addEvent`函数,我们可以实现同时绑定和执行多个`onload`事件处理函数,从而满足在页面加载过程中执行多个初始化任务的需求。

    用JavaScript事件串连执行多个处理过程的方法

    需要注意的是,`attachEvent`所指派的多个过程的执行顺序是随机的,因此这几个过程之间不要有顺序依赖。 另外,`attachEvent`和`addEventListener`不仅仅适用于`window`对象,其他的一些对象也支持该方法。 例如,...

    JavaScript 事件绑定及深入

    本文将详细介绍事件绑定的方式,包括传统事件绑定和现代事件绑定,以及在事件绑定过程中可能遇到的问题和解决方案。 ### 传统事件绑定 在JavaScript发展早期,事件绑定通常采用内联模型或脚本模型。内联模型是指在...

    最常用的10个javascript自定义函数(english)

    这个函数可以确保在页面加载完成后执行的事件处理器不会覆盖已有的 `onload` 事件处理器,而是将其合并在一起执行。 #### 3. getElementsByClass() - **功能概述**:`getElementsByClass()` 是一个用于根据类名...

    JS实现文件动态顺序载入的方法

    这要求我们不仅要仔细阅读文档,还可能需要对文档内容进行一定的校正和理解,以确保所得到的代码和逻辑是准确无误的。 总而言之,本文向我们展示了JavaScript中动态顺序载入文件的一种方法,具体是通过Mootools框架...

    仿google个性化首页模块拖拽效果

    - **DOM加载完成后的操作**:使用`window.onload`函数,在DOM加载完成后执行初始化操作,包括为所有`h1`元素添加`onmousedown`事件监听器。 3. **事件处理函数**: - **`addevent()`函数**:当用户点击某个可拖动...

    jQuery之$(document).ready()使用介绍

    这一函数是管理页面加载顺序和时机的核心部分,它确保了页面的DOM元素完全加载并可被脚本操作之后,才执行包裹在其中的代码。 ### 知识点:jQuery的$(document).ready()函数 #### 1. DOM加载时机和重要性 DOM...

    JavaScript事件详解

    通过这种方式,可以动态添加和管理事件处理函数,确保多个函数能够正确地按顺序执行,同时保持`this`指向正确的对象。 了解和掌握这些JavaScript事件及其处理机制,对编写具有交互性的网页和应用至关重要。事件处理...

    自动跳转的代码

    虽然这段代码并未直接实现页面的自动跳转功能,但通过对它的分析,我们可以引出与自动跳转相关的几个关键技术点。 #### 三、自动跳转实现方式 ##### 3.1 使用JavaScript实现自动跳转 **1. 基本原理:** 在客户端...

    Firefox浏览器兼容JS脚本

    本文将围绕Firefox浏览器与Internet Explorer(简称IE)之间关于JavaScript脚本的兼容性差异进行详细探讨,并通过具体的示例来帮助开发者更好地理解和解决实际开发过程中遇到的问题。 #### 二、关键知识点详解 ###...

    异步安全加载javascript文件的方法

    在`async_load`函数中,还有一个关键的逻辑处理在`s.onload`和`s.onreadystatechange`事件处理函数中。这些函数确保了只有在script标签加载完成之后才执行回调函数。这里还考虑了`readyState`的值,只有当script标签...

    JavaScript 注册事件代码

    但是,`attachEvent`和`addEventListener`还有一个区别:`addEventListener`可以添加多个同名事件处理函数,而`attachEvent`中的事件处理函数会按照添加顺序依次执行。因此,使用`addEventListener`时,不必担心覆盖...

    很酷的星级评分系统原生JS实现

    作者通过实践这个实例,提升了对各种编程知识点的理解,并强调了通过实际项目来增强技能和发现自身不足的重要性。 【涉及的知识点】: 1. **CSS边框(border)绘制三角形**: 通过调整不同边框宽度和颜色,可以创建...

Global site tag (gtag.js) - Google Analytics