给新生成的节点（动态生成节点）绑定事件方法总结

第一种 jquery写法

$('.father').on('click',',child',function(){})

$(document).on('click',',child',function(){})

第二种 js原生写法

document.querySelector('body').addEventListener('click',function (e) {
 if(e.target.classList.contains('.child')){
    //具体操作
}
})
document.querySelector('.father').addEventListener('click',function (e) {
 if(e.target.classList.contains('.child')){
    //具体操作
}
})
//可以直接取id，father是就是id
father.addEventListener('click',function (e) {
 if(e.target.id == 'child' ){
    //具体操作
}
})

  
item1
  
item2
  
item3

 

第三种 定时器写法

var id = setInterval(function () {
console.log('定时器循环事件绑定')
},1000)；

但是有些特殊情况会有bug，对于动态添加的这些事件是需要解绑的，具体解绑方法请参考原文https://juejin.im/post/5a1a350d51882560e3565665

还有一篇介绍事件绑定、事件委托、事件监听的很好的文章，再此推荐一下http://blog.xieliqun.com/2016/08/12/event-delegate/

 

转载于:https://www.cnblogs.com/wuyuchao/p/8309269.html