HTML5学堂-码匠 HTML5学堂

您当前位于:面试题精讲 ——> WEB前端面试真题 - JavaScript 什么是事件委托

WEB前端面试真题 - JavaScript 什么是事件委托

2015/04/27 14:43:39 | 作者:HTML5学堂(码匠) | 分类:面试题精讲 | 关键词:WEB前端,面试题,事件,事件委托

原生事件委托表述

HTML5学堂:本题属于JavaScript部分事件的面试题,主要考察的知识点是事件目标对象、事件冒泡、事件委托等。在回答此面试题时,需要注意的是,最好能够举出事件委托的实例,而不是空谈理论。对于事件委托,应当能够详细的阐述其概念和优势,而不是简要概括。

1、面试题种类

JavaScript、事件

2、面试题考核知识点

事件目标对象、事件冒泡、事件委托

3、面试题注意点

最好能够举出事件委托的实例,而不是空谈理论。对于事件委托能够详细的阐述其概念和优势。

欢迎沟通交流~HTML5学堂

4、面试题参考答案

简单来说,当时一个页面事件处理程序比较多的时候,我们通常情况下会使用事件委托。

事件委托主要利用了事件冒泡,只指定一个事件处理程序,就可以管理一个类型的所有事件。例如:我们为整个一个页面制定一个onclick事件处理程序,此时我们不必为页面中每个可点击的元素单独设置事件处理程序(onclick)事件委托:给元素的父级或者祖级,甚至页面绑定事件,然后利用事件冒泡的基本原理,通过事件目标对象进行检测,然后执行相关操作。其优势在于:

1. 大大减少了事件处理程序的数量,在页面中设置事件处理程序的时间就更少了(DOM引用减少——也就是上面我们通过id去获取标签,所需要的查找操作以及DOM引用也就更少了)。

2. document(注:上面的例子没有绑定在document上,而是绑定到了父级的div上,最为推荐的是绑定在document上)对象可以很快的访问到,而且可以在页面生命周期的任何时点上为它添加事件处理程序,并不需要等待DOMContentLoaded或者load事件。换句话说,只要可单击的元素在页面中呈现出来了,那么它就立刻具备了相应的功能。

3. 整个页面占用的内存空间会更少,从而提升了整体的性能。

相关概念:

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

欢迎沟通交流~HTML5学堂

微信公众号,HTML5学堂,码匠,原创文章,WEB前端,技术分享

HTML5学堂

原创前端技术分享

HTML5学堂,HTML5,WEB,前端,视频课程,技术视频,学习视频,面试,JS

原创视频课程

用心打造精品课程

微信小程序,决胜前端,面试题,面试题集合,前端,HTML5,真题

小程序-决胜前端

前端面试题宝库

原创书籍,学习书籍,书籍推荐,HTML5布局之路,HTML5,WEB前端

HTML5布局之路

非传统模式讲解前端

iOS,APP,码集,案例交互,JavaScript学习,WEB前端,HTML5

iOS APP 码集

案例交互式学习JS