本文介绍了Javascript事件:window.event对参数引用(函数)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧! 问题描述 29岁程序员,3月因学历无情被辞! 有什么区别: function test(e){console.log(Event:,e);} document.querySelector(button)。onclick = test; < button>点击!< / button> 和: function test(){console.log(Event:,event); //与window.event相同} document.querySelector(button)。onclick = test; 他们似乎返回完全相同的对象,甚至包含相同的 timeStamp 值,以毫秒为单位。 我经常使用第一个例子看到代码,使用 e 或 evt ,但是第二个例如? 我明白事件与 window.event ,这是一个全局变量,但如果事件执行相同操作,则使用 e 的目的是什么解决方案 标准方式 有两种标准方法添加事件监听器:事件处理程序和 addEventListener 。 事件处理程序 $ b $最初的DOM0(没有任何规格定义但广泛实施),它们在 HTML5规范中正确定义。 事件处理程序IDL属性 事件处理程序将是分配给IDL属性的函数。该函数(或回调)将以事件为唯一参数来调用:示例: document.querySelector(button)。onclick = function(evt){console.log('Event:'+ evt) ;}; < button>点击!按钮> 事件处理程序内容属性 一个事件处理程序内容属性是一个特定的内容属性事件处理程序。 content属性的名称是与事件处理程序。 设置它们时,处理程序将是一个内部未编译的处理程序。这意味着获得事件处理程序的当前值将更复杂:字符串将被解析为函数的 FunctionBody ,该函数的参数名为事件:示例: < button onclick =console.log('Event:'+ event);>单击!< / button> document.querySelector(button)。setAttribute('onclick',console.log('Event:'+ event);); < button>点击!< / button> addEventListener 由 DOM L2事件,现在 DOM4 将其定义为:当事件侦听器是被调用,回调调用事件作为唯一的参数:Event handler IDL attributesThe event handler will be the function assigned to the IDL attribute. That function (or callback) will be called with the event as its only argument:Example:document.querySelector("button").onclick = function(evt) { console.log('Event: ' + evt);};<button>Click!</button>Event handler content attributesWhen you set them, the handler will be an internal raw uncompiled handler. That means that getting the current value of the event handler will be more complex: the string will be parsed as the FunctionBody of a function which has an argument named event:Examples:<button onclick="console.log('Event: ' + event);">Click!</button>document.querySelector("button").setAttribute('onclick', "console.log('Event: ' + event);");<button>Click!</button>addEventListenerIt was introduced by DOM L2 Events, and now DOM4 defines it as:When the event listeners are invoked, the callback is called with the event as its only argument:Example:document.querySelector("button").addEventListener('click', function(evt) { console.log('Event: ' + evt);});<button>Click!</button>Compatibility notesOld IE didn't support addEventListener, and didn't pass any argument to event handlers.However, it provided another way to access the event: window objects inherit an event property from Window.prototype. That property has a getter which returns the event object.Therefore, a common way to support old IE is using an argument and overriding it with window.event if necessary:document.querySelector("button").onclick = function(evt) { evt = evt || window.event; console.log('Event: ' + evt);};<button>Click!</button>New IE passes the event as an argument in both addEventListener and event handlers, so that is no longer necessary. It also continues implementing Window.prototype.event.Similarly, Chrome implements window.event, probably to support old code written for IE.However, better avoid using that:It is not standard.The standard alternatives are widely implemented (except on old IE).It doesn't work on all browsers, for example on Firefox. 这篇关于Javascript事件:window.event对参数引用(函数)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持! 上岸,阿里云!
09-03 15:17