开发者社区> 问答> 正文

什么是事件委托?

展开
收起
前端问答 2019-12-11 08:05:46 853 0
1 条回答
写回答
取消 提交回答
  • 前端问答小助手

    事件委托就是利⽤事件冒泡,只指定⼀个事件处理程序,就可以管理某⼀类型的所有事件。

    在绑定⼤量事件的时候往往选择事件委托。

    <ul id="parent">
    <li class="child">one</li>
    <li class="child">two</li>
    <li class="child">three</li>
    ...
    </ul>
    <script type="text/javascript">
    //⽗元素
    var dom= document.getElementById('parent');
    //⽗元素绑定事件,代理⼦元素的点击事件
    dom.onclick= function(event) {
    var event= event || window.event;
    var curTarget= event.target || event.srcElement;
    if (curTarget.tagName.toLowerCase() == 'li') {
    //事件处理
    }
    }
    </script>
    

    优点:

    • 节省内存占⽤,减少事件注册
    • 新增⼦对象时⽆需再次对其绑定事件,适合动态添加元素

    局限性:

    • focus、blur 之类的事件本身没有事件冒泡机制,所以⽆法委托
    • mousemove、mouseout 这样的事件,虽然有事件冒泡,但是只能不断通过位置去计算定位,对性能消耗⾼,不适合事件委托
    2019-12-11 08:06:57
    赞同 1 展开评论 打赏
问答分类:
问答地址:
问答排行榜
最热
最新

相关电子书

更多
低代码开发师(初级)实战教程 立即下载
冬季实战营第三期:MySQL数据库进阶实战 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载