JavaScriptDOM添加事件_javascript技巧
作者:h619718610 | 来源:互联网 | 2018-05-14 10:01
这是我在给库中添加事件的时候写的添加事件的方法!这个方法实现了跨浏览器之间的方法!
因为对于支持DOM的浏览器来说,添加事件是用addEventListener()方法来给对象添加事件!
而对于MSIE来说则是用attachEvent()来给对象添加事件!这就使得我们必须用一个容器来装载这两个不同浏览器上对事件的处理方式!这样我们就可以直接调用addEvent()方法来给对象添加事件了!
这不是更方便?!呵呵……
让我们来看看吧!
/**
* 注册一个监听事件到元素
* @param {Object} node 所要添加事件的对象
* @param {Object} type 事件类型
* @param {Object} listener 事件方法
*/
function addEvent( node, type, listener ) {
//使用前面的方法检查兼容性以保证平稳退化
if(!(node = $(node))) return false;
if(node.attachEvent) { // 这是针对IE 的方法
node['e'+type+listener] = listener;
node[type+listener] = function(){node['e'+type+listener]( window.event );}
node.attachEvent( 'on'+type, node[type+listener] );
return true;
}else if (node.addEventListener) {
// 这是针对支持DOM的浏览器的方法
node.addEventListener( type, listener, false );
return true;
}
// 若两种方法都不具备则返回false;
return false;
};
window['liujingning']['addEvent'] = addEvent;
使用方法:
比如我们要给页面的onload()上添加事件,我们就可以这样写:
liujingning.addEvent(window,'load',function(Event) { //这里写你要写的代码}
我们也可以给某个ID添加事件
var getId = document.getElementById('aa');
liujingning.addEvent(getId,'load',function(Event) { //这里写你要写的代码}
推荐阅读
-
本文探讨了Android开发中常用的两种布局方式——LinearLayout和AbsoluteLayout,通过实例分析它们的特点及应用场景。 ...
[详细]
蜡笔小新 2024-11-28 17:39:36
-
匠心|传统_2021年度总结 | 葡萄城软件开发技术回顾(上) ...
[详细]
蜡笔小新 2024-11-28 16:47:46
-
-
本文详细介绍了如何使用 Docker 部署 MongoDB,并通过 IntelliJ IDEA 实现远程连接的方法。包括 MongoDB 的基本配置、用户管理以及如何在 IDE 中配置连接。 ...
[详细]
蜡笔小新 2024-11-27 14:32:36
-
本文介绍了Spring Boot框架的基础知识,包括其设计理念、主要优势以及如何简化传统的J2EE开发流程。 ...
[详细]
蜡笔小新 2024-11-27 10:39:14
-
本文探讨了酷家乐在 Serverless FaaS 领域的实践与经验,重点介绍了 FaaS 平台的构建、业务收益及未来发展方向。 ...
[详细]
蜡笔小新 2024-11-27 10:22:39
-
本课程为 Python 进阶系列的第四部分,专注于 Pandas 库的高级应用。课程将涵盖数据分析、数据可视化及数据预处理等多个方面,旨在帮助学员全面掌握 Pandas 在数据科学中的应用。 ...
[详细]
蜡笔小新 2024-11-27 08:17:21
-
ODB 2.1.0 版本现已推出,此更新引入了多项新功能,如通过访问器、修饰符、函数及表达式访问数据成员,支持虚拟数据成员,并允许在数据成员上直接定义数据库索引等。 ...
[详细]
蜡笔小新 2024-11-27 01:34:26
-
插件描述:这是一个文件上传的展示,看很多插件,并不满意就自己写了一个,可能兼容性不是很好,没有准确进行测试过& ...
[详细]
蜡笔小新 2024-11-26 16:41:31
-
对于初次购买阿里云服务器的新手用户来说,如何高效地利用服务器资源并成功部署网站是一个重要的课题。本文将详细指导您完成从购买服务器到网站上线的六个关键步骤。 ...
[详细]
蜡笔小新 2024-11-26 12:31:45
-
本文旨在探讨RuntimeClass的起源、功能及其在多容器运行时环境中的实际应用。通过详细的案例分析,帮助读者理解如何在Kubernetes集群中高效管理不同类型的容器运行时。 ...
[详细]
蜡笔小新 2024-11-25 15:13:46
-
本文详细介绍了如何在Vue项目中集成和配置XGPlayer视频插件,包括安装步骤、基本配置以及常见问题的解决方法。 ...
[详细]
蜡笔小新 2024-11-25 15:09:45
-
本文介绍了如何通过官方提供的简易示例,快速上手 Kubernetes (K8S),并深入理解其核心概念和操作流程。 ...
[详细]
蜡笔小新 2024-11-25 11:09:16
-
本文将探讨Nacos服务自动注册的具体实现方法,特别是如何通过Spring事件机制完成服务注册。通过对Nacos源码的详细分析,帮助读者理解其背后的原理。 ...
[详细]
蜡笔小新 2024-11-25 11:00:16
-
目录一、docker-compose二、docker-compose安装与配置1、修改docker.service2、下载文件3、将刚才下载的docker-compose文 ...
[详细]
蜡笔小新 2024-11-25 10:14:20
-
2.1、组件添加1、Configuration基本使用Full模式与Lite模式示例最佳实战配置类组件之间无依赖关系用Lite模式加速容器启动过程,减少判断配置类组 ...
[详细]
蜡笔小新 2024-11-25 09:48:01
-
h619718610
这个家伙很懒,什么也没留下!