首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

浅谈JavaScript事件事件对象

在触发DOM上某个事件时,会产生一个事件对象event,这个对象中包含这所有与事件有关信息。包括导致事件元素、事件类型和事件相关信息。例如鼠标操作事件中,会包含鼠标的位置信息。...而键盘触发事件会包含与按下键有关信息。所有浏览器都支持event对象,但支持方式不同。 DOM中事件对象   兼容dom浏览会将一个event对象传递到事件处理程序中。...只读 为true表示事件是浏览器生成,false表示JavaScript添加 type String 只读 被触发事件类型 view AbstarctView 只读 与事件关联抽象视图   上面的表格列出了...document.body.onclick发生在事件冒泡阶段。 IE中事件对象   在IE中方式event对象可以通过多种方式,取决于指定事件处理程序方法。...但是如果通过attachEvent添加事件,则事件处理程序会传递一个event对象。   IEevent对象同样包含创建它相关属性和方法,与DOM事件一样,也会因为事件类型不同而不同。

1.2K60

【EventBus】事件通信框架 ( 订阅类-订阅方法缓存集合 | 事件类型-订阅者集合 | 订阅对象-事件类型集合 )

+ 订阅方法 封装类 ; /** * Key - 订阅者方法事件参数类型 * Value - 封装 订阅对象订阅方法 MySubscription 集合...>>> typesBySubscriber ; Key - 订阅对象 ; Value - 订阅对象中所有的订阅方法事件参数类型集合 ; 在注册时 , 设置该对象对应订阅方法接收事件类型 , 在取消注册时..., 可以根据该订阅对象 , 查找所有订阅方法事件参数类型 , 然后再到 METHOD_CACHE 中 , 根据事件参数类型 , 查找对应 MySubscription 集合 , 从而找到 MySubscription...中封装 订阅对象 + 订阅方法 ; /** * 解除注册时使用 * Key - 订阅对象 * Value - 订阅对象中所有的订阅方法事件参数类型集合...* * 根据该订阅对象 , 查找所有订阅方法事件参数类型 , 然后再到 METHOD_CACHE 中 , * 根据事件参数类型 , 查找对应 MySubscriberMethod

87620
您找到你想要的搜索结果了吗?
是的
没有找到

JavaScript事件对象

theme: channing-cyan 这是我参与8月更文挑战第27天,活动详情查看:8月更文挑战 什么是事件对象 事件对象其实就是event对象,在我们操作DOM发生事件时,所有的相关信息都会被集中存储在这个...event对象中,这个对象中包含了被发生事件元素,发生事件类型以及可能与特点事件相关其他数据,所有浏览器都支持这个event对象,但是ie访问方式略有不同,我们稍后细说,往下观看。...DOM事件对象 event对象是传给事件处理程序唯一参数,我们输出一下它看看里面都有什么。...我们说一下this指向问题 在事件处理程序内部,this对象始终等于currentTarget值。...IE事件对象 前面提到过ie访问方式不同,在ie中event对象可能是window对象一个属性。

67330

JavaScript 事件对象

一.事件对象 事件处理三部分组成:对象.事件处理函数=函数。例如:单击文档任意处。...onclick表示一个事件处理函数或绑定对象属性(或者叫事件监听器、侦听器)。document表示一个绑定对象,用于触发某个元素区域。function()匿名函数是被执行函数,用于触发后执行。...}; 从上面的拆分,我们并没有发现本章重点:事件对象。...那么事件对象是什么?它在哪里呢?当触发某个事件时,会产生一个事件对象,这个对象包含着所有与事件有关信息。包括导致事件元素、事件类型、以及其它与特定事件相关信息。...事件对象,我们一般称作为event对象,这个对象是浏览器通过函数把这个对象作为参数传递过来。那么首先,我们就必须验证一下,在执行函数中没有传递参数,是否可以得到隐藏参数。

1.9K100

JavaScript事件对象事件委托

事件对象 包含事件相关信息,如鼠标、时间、触发DOM对象等  js默认将事件对象封装好,并自动以参数形式,传递给事件处理函数第1个参数,如下: document.getElementsByTagName...("div")[0].onclick = function(e){   e = window.event || e; //兼容IE低版本(事件对象绑定在windowevent上)   console.log...(e);//这里e就是事件对象 } 事件属性和方法 type:获取事件类型(click、mouseover等等) target:获取发生所在元素(在低版本IE下用srcElement属性) stopPropagation...() 阻止事件冒泡(IE用cancelBubble属性为false阻止冒泡) preventDefault() 阻止事件默认行为(IE用returnValue属性为false阻止默认行为) 事件委托 利用...target属性,获取时间发生所在对象,避免全体子元素加事件,对比如下:  var tbs=document.getElementsByTagName("td"); for(var i=0;i

88850

JavaScript事件对象事件处理程序

一、事件对象 事件对象:在DOM触发事件时,会产生一个事件对象event,这个事件对象包含着所有与事件相关信息。...既然event是事件对象,那么它必然存在属性   ①DOM中事件对象event属性   (1)、type属性用于获取事件类型   (2)、target、srcElement...属性用于获取事件目标   (3)、stopPropagation()方法 用于阻止事件冒泡   (4)、preventDefault() 方法 阻止事件默认行为 二、DOM2级事件处理程序...  (1)、addEventListener() 用于处理指定事件处理程序操作  (2)、removeEventListener() 用于处理删除事件处理程序操作 三、IE事件处理程序   (1...)、attachEvent() 用于处理指定事件处理程序操作  (2)、detachEvent() 用于处理移除事件处理程序操作

79230

JavaScript函数、对象事件

圆括号可包括由逗号分隔参数,由函数执行代码被放置在花括号 {} 中: function name(参数 1, 参数 2, 参数 3) { 要执行代码 } 当 JavaScript 到达 return...name 引用是函数对象,而 name() 引用是函数结果。可以将函数对象赋值给变量(变量值是函数定义)。...对象 JavaScript 对象也是变量,但是对象包含很多值。JavaScript 对象是被命名值容器。 值以名称:值对方式来书写(名称和值由冒号分隔),名称:值对被称为属性。...对象也可以有方法,方法是在对象上执行动作。方法以函数定义被存储在属性中。方法实际上是以属性值形式存储函数定义。...事件 HTML 事件可以是浏览器或用户做某些事情,比如: HTML 网页完成加载 HTML 输入字段被修改 HTML 按钮被点击 ⋯\cdots⋯ 通过 JavaScript 代码,HTML 允许您向

59720

javascript--自定义对象

前言 JS对象是一种复合类型,它允许你通过变量名存储和访问,换一种思路,对象是一个无序属性集合,集合中每一项都由名称和值组成(听起来是不是很像我们常听说HASH表、字典、健/值对?)...,而其中值类型可能是内置类型(如number,string),也可能是对象。这种方式不能用new方式创建,所以不可重用。 字面量方式-最简单方式 这种创建对象方式通过{}来组织对象属性和方法。...对象要用自己方法,使用 this 进行调用。...构造函数方式 可重用,先像Java一样创建一个对象模板,然后new一个出来。this在里面的用法一样。 第二种创建对象方式。...指向,new对象指向名部方法。

22530

怎么创建 JavaScript 自定义事件

图中是这个事件对象最基本形式。它包含大量信息,最重要部分我这里突出显示了。 isTrusted 属性仅指该事件是由用户交互触发,还是由自定义 JavaScript 代码触发。...例如,当用户单击按钮时,事件将 isTrusted 设置为 true,而我们自定义事件会将其设置为 false,因为该事件是由 JavaScript 触发。...custom: 以区分自定义事件和本身事件,而且,如果 JavaScript 添加与你事件同名事件,它还可以确保你代码不会中断。...举个例子,如果 JavaScript 添加了一个名为 doubleclick 事件,然后你已经在时候 doubleclick 自定义事件了,那么你会遇到问题,因为你自定义代码将触发该事件,并且浏览器也会尝试触发它自己副本...总结 自定义事件JavaScript 中处理手势和双击事件好方案,最重要是,他们非常容易实现和使用。 【完】✅

1.3K10

怎么创建 JavaScript 自定义事件

图中是这个事件对象最基本形式。它包含大量信息,最重要部分我这里突出显示了。 isTrusted 属性仅指该事件是由用户交互触发,还是由自定义 JavaScript 代码触发。...例如,当用户单击按钮时,事件将 isTrusted 设置为 true,而我们自定义事件会将其设置为 false,因为该事件是由 JavaScript 触发。...custom: 以区分自定义事件和本身事件,而且,如果 JavaScript 添加与你事件同名事件,它还可以确保你代码不会中断。...举个例子,如果 JavaScript 添加了一个名为 doubleclick 事件,然后你已经在时候 doubleclick 自定义事件了,那么你会遇到问题,因为你自定义代码将触发该事件,并且浏览器也会尝试触发它自己副本...总结 自定义事件JavaScript 中处理手势和双击事件好方案,最重要是,他们非常容易实现和使用。

1.4K10

jQuery 事件(三) 事件绑定和解绑、对象使用、自定义事件

() 事件对象使用 jQuery事件对象作用 标准”click”点击事件 $(elem).on("click",function(event){ event //事件对象 }) 在不同浏览器之间事件对象获取...这个问题引出了事件对象事件对象是用来记录一些事件发生时相关信息对象。...方法就可以调用到alert .trigger定义 根据绑定到匹配元素给定事件类型执行所有的处理程序和行为 trigger除了能够触发浏览器事件,同时还支持自定义事件,并且自定义时间还支持传递参数 $...',['参数1','参数2']) trigger触发浏览器事件自定义事件区别 自定义事件对象,是jQuery模拟原生实现 自定义事件可以传递参数 triggerHandler事件 trigger事件还有一个特性...:会在DOM树上冒泡,所以如果要阻止冒泡就需要在事件处理程序中返回false或调用事件对象.stopPropagation() 方法可以使事件停止冒泡 trigger事件是具有触发原生与自定义能力

4K30

JavaScript对象管理和事件清理

JavaScript作为一种垃圾回收语言,通常我们不必关心对象分配和释放问题。但偶尔,在处理回调函数时,即使不再有任何有意义引用,也很容易让对象永远保持活跃状态。...一个常见情况是对象关心某些外部状态变化,只要它们存在就要关注。例如,自定义元素可能希望在window对象上监听"scroll"事件。但是,简单地向window添加事件侦听器意味着保留对对象引用。...如果这些自定义元素生命周期很短但数量很多,它们将在内存中累积,并且额外事件侦听器也会堆积并浪费处理能力。...为了实现这一点,我们可以利用两个特性:首先,将事件侦听器中对this强引用替换为WeakRef将阻止事件侦听器在没有其他引用存在时保持对象活跃。...现在我们只需要在创建时注册对象,并将控制器信号传递给事件侦听器。

17300

JavaScript 允许自定义对象分析

JavaScript所有事物都是对象:字符串、数值、数组、函数... 此外,JavaScript 允许自定义对象。...JavaScript 提供多个内建对象,比如 String、Date、Array 等等。 对象只是带有属性和方法特殊数据类型。 Number 对象 JavaScript 只有一种数字类型。...JavaScript Window - 浏览器对象模型 浏览器对象模型 (BOM) 使 JavaScript 有能力与浏览器“对话”。 所有浏览器都支持 window 对象。它表示浏览器窗口。...所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象成员。 全局变量是 window 对象属性。 全局函数是 window 对象方法。...() - 调整当前窗口尺寸 Window Screen window.screen 对象包含有关用户屏幕信息。

36900
领券