差异$('div').on('click'...和$(document).on('click','div'

Question

有什么区别

$('div').on('click', function() {
   alert(1);
});

和

$(document).on('click', 'div', function() {
   alert(1);
});

Answer 1

第一个将点击事件结合在现有的元件中DOM,并稍后将绑定事件对于其存在于DOM或事件绑定代码的执行之后动态地添加元素.第二种方法称为事件委托

直接和委派活动

大多数浏览器事件从文档中最深的,最里面的元素(事件目标)起泡或传播,它们一直发生到正文和文档元素.在Internet Explorer 8及更低版本中,诸如更改和提交之类的一些事件本身不会冒泡,但jQuery会将这些事件修补为冒泡并创建一致的跨浏览器行为.

如果省略selector或为null,则事件处理程序称为直接或直接绑定.每次在所选元素上发生事件时都会调用该处理程序,无论它是直接发生在元素上还是来自后代(内部)元素的气泡.

提供选择器时,事件处理程序称为委托.当事件直接发生在绑定元素上时,不会调用处理程序,但仅适用于与选择器匹配的后代(内部元素).jQuery将事件从事件目标起泡到附加处理程序的元素(即最内层到最外层元素),引用