以前写 JavaScript 脚本时,事件都是采用
object.event = handler;
的方式初始化。这种方式对于 Internet Explorer、Mozilla/Firefox 和 Opera 来说很通用。但是有一个问题就是,这种方式只能一个事件对应一个事件处理过程。如果希望一个事件可以依次执行多个处理过程就不好用了。

但是 Internet Explorer 从 5.0 开始提供了一个 attachEvent 方法,使用这个方法,就可以给一个事件指派多个处理过程了。attachEvent 对于目前的 Opera 也适用。但是问题是 Mozilla/Firefox 并不支持这个方法。但是它支持另一个 addEventListener 方法,这个方法跟 attachEvent 差不多,也是用来给一个事件指派多个处理过程的。但是它们指派的事件有些区别,在 attachEvent 方法中,事件是以 “on” 开头的,而在 addEventListener 中,事件没有开头的 “on”,另外 addEventListener 还有第三个参数,一般这个参数指定为 false 就可以了。

因此要想在你的程序中给一个事件指派多个处理过程的话,只要首先判断一下浏览器,然后根据不同的浏览器,选择使用 attachEvent 还是 addEventListener 就可以了。实例如下:

if (window.attachEvent) { 
                window.attachEvent("onload", remove); 
            } else if (window.addEventListener) { 
                window.addEventListener("load", remove, false);   
            }             
            function remove() { 
                var div = document.getElementById("divprogressbar"); 
                document.body.removeChild(div); 
            }

=============或者也可以用

document.all用法

 
一.
 document.all是页面内所有元素的一个集合。例如:      
 document.all(0)表示页面内第一个元素
二.
document.all可以判断浏览器是否是IE  
  if(document.all){  
    alert("is   IE!");  
  }
三.
也可以通过给某个元素设置id属性(id=aaaa),然后用document.all.aaaa调用该元素
四.
案例:

代码1:    
  <input   name=aaa   value=aaa>  
  <input   id=bbb   value=bbb>   
  <script   language=Jscript>  
      alert(document.all.aaa.value)     //根据name取value  
      alert(document.all.bbb.value)     //根据id取   value  
  </script>    
代码2:  
      但是常常name可以相同(如:用checkbox取用户的多项爱好的情况)   
  <input   name=aaa   value=a1>  
  <input   name=aaa   value=a2>  
  <input   id=bbb   value=bbb>   
  <script   language=Jscript>  
      alert(document.all.aaa(0).value)     //显示a1  
      alert(document.all.aaa(1).value)     //显示a2  
      alert(document.all.bbb(0).value)     //这行代码会失败  
  </script>    
代码3:  
      理论上一个页面中的id是互不相同的,如果出现不同tags有相同的id  
  document.all.id   就会失败,就象这样:  
  <input   id=aaa   value=a1>  
  <input   id=aaa   value=a2>  
  <script   language=Jscript>  
      alert(document.all.aaa.value)     //显示   undefined   而不是   a1或者a2  
  </script>   
代码4:  
 对于一个复杂的页面(代码很长,或者id是由程序自动产生),或着一个  
  javascript初学者写的程序,很有可能出现两个tags有相同id的情况。  
 为了编程的时候不出错,我推荐这样的写法:  
   
  <input   id=aaa   value=aaa1>  
  <input   id=aaa   value=aaa2>  
  <input   name=bbb   value=bbb>  
  <input   name=bbb   value=bbb2>  
  <input   id=ccc   value=ccc>  
  <input   name=ddd   value=ddd>  
   
  <script   language=Jscript>  
      alert(document.all("aaa",0).value)    
      alert(document.all("aaa",1).value)    
      alert(document.all("bbb",0).value)    
      alert(document.all("bbb",1).value)    
      alert(document.all("ccc",0).value)    
      alert(document.all("ddd",0).value)    
  </script>  

if (document.all){window.attachEvent('onload',remove)}//IE
else{window.addEventListener('load',remove,false);} //FireFox

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

浅谈window.attachEvent的更多相关文章

  1. QML学习之浅谈Window

     转载地址:http://blog.csdn.net/kanchuan1905/article/details/53762788 在Qt Quick的世界里,Window对象用于创建一个与操作系统相关 ...

  2. 浅谈 LayoutInflater

    浅谈 LayoutInflater 版权声明:本文为博主原创文章,未经博主允许不得转载. 微博:厉圣杰 源码:AndroidDemo/View 文中如有纰漏,欢迎大家留言指出. 在 Android 的 ...

  3. 浅谈Hybrid技术的设计与实现第三弹——落地篇

    前言 接上文:(阅读本文前,建议阅读前两篇文章先) 浅谈Hybrid技术的设计与实现 浅谈Hybrid技术的设计与实现第二弹 根据之前的介绍,大家对前端与Native的交互应该有一些简单的认识了,很多 ...

  4. 浅谈Hybrid技术的设计与实现第二弹

    前言 浅谈Hybrid技术的设计与实现 浅谈Hybrid技术的设计与实现第二弹 浅谈Hybrid技术的设计与实现第三弹——落地篇 接上文:浅谈Hybrid技术的设计与实现(阅读本文前,建议阅读这个先) ...

  5. 浅谈Hybrid技术的设计与实现

    前言 浅谈Hybrid技术的设计与实现 浅谈Hybrid技术的设计与实现第二弹 浅谈Hybrid技术的设计与实现第三弹——落地篇 随着移动浪潮的兴起,各种APP层出不穷,极速的业务扩展提升了团队对开发 ...

  6. 浅谈HTML5单页面架构(一)——requirejs + angular + angular-route

    心血来潮,打算结合实际开发的经验,浅谈一下HTML5单页面App或网页的架构. 众所周知,现在移动Webapp越来越多,例如天猫.京东.国美这些都是很好的例子.而在Webapp中,又要数单页面架构体验 ...

  7. 浅谈HTML5单页面架构(二)——backbone + requirejs + zepto + underscore

    本文转载自:http://www.cnblogs.com/kenkofox/p/4648472.html 上一篇<浅谈HTML5单页面架构(一)--requirejs + angular + a ...

  8. 浅谈JS之AJAX

    0x00:什么是Ajax? Ajax是Asynchronous Javascript And Xml 的缩写(异步javascript及xml),Ajax是使用javascript在浏览器后台操作HT ...

  9. 浅谈javascript函数节流

    浅谈javascript函数节流 什么是函数节流? 函数节流简单的来说就是不想让该函数在很短的时间内连续被调用,比如我们最常见的是窗口缩放的时候,经常会执行一些其他的操作函数,比如发一个ajax请求等 ...

随机推荐

  1. DataTable 导出Excel 下载 (NPOI)

        public class ExcelHelper { public void DownLoadExcelNew(System.Data.DataTable data, Hashtable h, ...

  2. win7 去除桌面快捷方式小箭头

    二手入了个 sony 的本子 vgn-sz780 拿手上,感觉真心不错,然后装系统,装好xp后发现怎么折腾都没声音,由于我的硬盘是SSD的虽然有点小只有60G,但是速度还是蛮不多的,于是一横心就装了 ...

  3. Java学习笔记--泛型

    一个泛型类就是具有一个或者多个类型变量的类. 我们可以只关注泛型,而不会为数据存储的细节而烦恼 . java泛型(一).泛型的基本介绍和使用 http://blog.csdn.net/lonelyro ...

  4. [CSAPP]并发与并行

    学了这么久的计算机,并发与并行的概念理解的一直不够透彻.考研复习那会儿,以为自己懂了,然而直到看了CSAPP才算是真正明白了这俩个概念. 并发(concurrency) 流X和流Y并发运行是指,流X在 ...

  5. android核心分析--转

    http://blog.csdn.net/column/details/androidcore.html http://simon-fu.vicp.cc/?p=999 http://www.uml.o ...

  6. ET 与RETI 基于51单片机中断跳出指令“RETI”浅议

    最近在基于51单片机编程的过程中出现了个很奇怪的问题“程序执行中在寄存器EA=1,ET0=1,TR0=1条件下,单TF0=1时并没有执行中断”.在有过单片机中断编程经历者都知道当EA=1,ET0=1的 ...

  7. [Android]通过setImageURI设置网络上面的图片

    设置imageView显示网络上的图片 picUrl = new URL(getIntent().getExtras().getString("map_url")); Bitmap ...

  8. java.lang.OutOfMemoryError: GC overhead limit exceeded 问题分析和解决(转)

    在项目历史数据导入过程中,出现了应用无法访问的情况.立刻对Weblogic进行分析,发现Weblogic的内存.线程等性能良好,Server也是Running的状态.随后查看了Weblogic日志,在 ...

  9. UIScrollView入门与框架设计

    一.概述 1.UIScrollView的contentSize, contentOffSet, contentInsets的作用和使用. 2.UIScrollView的一整个滚动过程的生命周期(开始滚 ...

  10. 线段树(build,insert,dfs操作)

    模板原型: 解决零散数点在已知线段上的出现次数.思想是将线段用长线覆盖,将长线转化成线段树.用权值记录各个数点出现的次数,最后进行查询.代码解释见注释. #include <bits/stdc+ ...