在触发DOM上的某个事件时,会产生一个事件对象event,这个对象中包含着所有与事件相关的信息。

包括导致事件的元素、事件的类型以及其他与特定事件相关的信息。

例如:鼠标操作导致的事件对象中,会包含鼠标位置的信息,而键盘操作导致的事件对象中,会包含与按下的键有关的信息。

所以浏览器都支持event对象,但支持方式不同。

        btn_event.onclick = function (event) {
alert(event.type);//"click"
}; btn_event.addEventListener("click", function (event) {
alert(event.type);//"click"
}, false);
当一个函数要处理多个事件时,则可以使用type属性:
      //当一个函数要处理多个事件时,则可以使用type属性。

        var hanler_type = function (event)
{
switch (event.type) {
case "click":
{
alert("click");
break;
};
case "mouseover":
{
event.target.style.backgroundColor = "Red";
break;
};
case "mouseout":
{
event.target.style.backgroundColor = "Blue";
break;
};
};
}; btn_event.onclick = hanler_type;
btn_event.onmouseover = hanler_type;
btn_event.onmouseout = hanler_type;

上面代码效果图:

DOM中的事件对象(event)的更多相关文章

  1. DOM中的事件对象

    三.事件对象事件对象event1.DOM中的事件对象(1).type:获取事件类型(2).target:事件目标(3).stopPropagation() 阻止事件冒泡(4).preventDefau ...

  2. js事件对象--DOM中的事件对象/IE中的事件对象/跨浏览器的事件对象

    事件对象    在触发DOM上的某个事件时,会产生一个事件对象event,这个对象中包含着所有与事件有关的信息.包括导致事件的元素.事件的类型,以及其他与特定事件相关的信息.例如,鼠标操作导致的事件对 ...

  3. DOM中的事件对象和IE事件对象

    DOM中的事件对象 IE事件对象 属性/方法 类型 读/写 说明 属性/方法 类型 读/写 说明  bubles Boolean 只读  表明事件是否冒泡  cancleBubble Boolean ...

  4. javaScript中的事件对象event

    事件对象event,每当一个事件被触发的时候,就会随之产恒一个事件对象event,该对象中主要包括了关于该事件的基本属性,事件类型type(click.dbclick等值).目标元素target(我的 ...

  5. javaScript中的事件对象event是怎样

    事件对象event,每当一个事件被触发的时候,就会随之产恒一个事件对象event,该对象中主要包含了关于该事件的基本属性,事件类型type(click.dbclick等值).目标元素target(我的 ...

  6. DOM和IE中的 事件对象

    DOM中的事件对象:(符合W3C标准)    preventDefault()        取消事件默认行为    stopImmediatePropagation() 取消事件冒泡同时阻止当前节点 ...

  7. JavaScript中的事件对象

    JavaScript中的事件对象 JavaScript中的事件对象是非常重要的,恐怕是我们在项目中使用的最多的了.在触发DOM上的某个事件时,会产生一个事件对象event,这个对象中包含这所有与事件有 ...

  8. IE中的事件对象

    IE中的事件对象 1)type属性 用于获取事件类型 2)srcElement属性 用于获取事件的目标 3)cancelBubble属性 用于阻止事件冒泡 设置为true表示阻止事件冒泡  设置为fa ...

  9. 谈谈事件对象-event

    JavaScript 中的事件对象(event) 当我们每次触发一种事件(如点击事件),我们会在回调函数中传入事件对象event.今天就来来谈谈. 1.当我们想判断当前事件是我们想要的事件类型时,可以 ...

随机推荐

  1. luogu2402 奶牛隐藏

    题目描述 在一个农场里有n块田地.某天下午,有一群牛在田地里吃草,他们分散在农场的诸多田地上,农场由m条无向的路连接,每条路有不同的长度. 突然,天降大雨,奶牛们非常混乱,想要快点去躲雨.已知每个田地 ...

  2. sspanelv3魔改版邮件设置指南及常用配置

    要进行SSpanel v3魔改版邮件设置,需要在设置文件(位于config/.config.php下)中修改两处内容: 1.设置发送邮件的方式 $System_Config['enable_email ...

  3. java支付宝开发-02-手机网站支付

    源码已上传github,欢迎专注:https://github.com/shirayner/alipay-wap 一.基础部分 1.手机网站支付产品介绍 1.1 阅读官方介绍: 手机网站支付产品介绍 ...

  4. JAVA设计模式--装饰器模式

    装饰器模式 装饰器模式(Decorator Pattern)允许向一个现有的对象添加新的功能,同时又不改变其结构.这种类型的设计模式属于结构型模式,它是作为现有的类的一个包装. 这种模式创建了一个装饰 ...

  5. javaweb代码生成器,专注于javaweb项通用目的代码生成器

    该项目为javaWEB项目通用代码生成器,根据数据库表和自定义代码模板生成相应的jsp,js,java文件,生成到指定路径下,javaweb项目开发利器: 项目开源地址:https://gitee.c ...

  6. PetaPoco批量插入数据

    VS添加完组件,自动生成的PetaPoco.cs文件中没有SqlBulkInsert这个方法,但是可以在里面添加,代码如下: /// <summary> /// BulkInsert // ...

  7. Python使用Scrapy框架爬取数据存入CSV文件(Python爬虫实战4)

    1. Scrapy框架 Scrapy是python下实现爬虫功能的框架,能够将数据解析.数据处理.数据存储合为一体功能的爬虫框架. 2. Scrapy安装 1. 安装依赖包 yum install g ...

  8. 快速了解react

    概况: 通过本篇文章你可以对react的重点有个整体的认识. 关于react是什么,优点,解决什么问题等,网上一大推就不啰嗦了. 了解虚拟DOM的实现,参考这篇文章 [虚拟DOM](https://w ...

  9. Java基于自定义注解的面向切面的实现

    目的:实现在任何想要切的地方添加一个注解就能实现面向切面编程 自定义注解类 @Target({ElementType.PARAMETER, ElementType.METHOD}) @Retentio ...

  10. Bond UVA - 11354(LCA应用题)

    Once again, James Bond is on his way to saving the world. Bond's latest mission requires him to trav ...