JQuery事件委托原理与用法实例分析
本文实例讲述了JQuery事件委托原理与用法。分享给大家供大家参考,具体如下:
事件委托就是利用事件冒泡的原理,把事件加到父级上,通过判断事件来源的子集,执行相应的操作。事件委托首先可以极大的减少事件绑定次数,其次也可以让新加入的子集元素也拥有相同的操作。
一般绑定事件的写法以及事件冒泡
Title .list{ background-color:gold; list-style-type:none; padding:10px; } .listli{ height:30px; background-color:green; margin:10px; } $(function(){ /*$('.listli').click(function(){ $(this).css({backgroundColor:'red'}); });*///写成事件委托的方式,把委托的事件放在父级 $('.list').delegate('li','click',function(){ $(this).css({backgroundColor:'red'}); }); //新建li元素复制给$li变量 var$li=$(' 9 '); $('.list').append($li);//把新建元素放到ul子集最后面。这就是节点操作 })1 2 3 4 5 6 7 8