javascript - 为什么新增的 标签的 ，邦定的事件无效，这个时候要求我们用 on（）来绑定事件，为什么？内部机制是什么？

Question

谁能给我解释下，为什么新增的 标签的 ，邦定的事件无效，这个时候要求我们用 on（）来绑定事件，为什么？内部机制是什么？为什么无效？为什么on可以实现有效？

Answer 1

因为绑定事件的代码执行过后，新添加进来的元素没有绑定事件，当然就不行了。

on也不能绑定在新添加的元素上，实际上是绑定在document对象或祖先元素上的，然后通过selector来判断触发事件的元素是不是符合选择器。这样不管添加多少新元素都能触发事件。

Answer 2

普通绑定只对当前存在的元素有效; on 绑定则会监听指定DOM元素下的变更，及时给新元素绑定事件

参考: https://api.jquery.com/on/

Answer 3

想弄清楚这个问题，你应该知道1.js加载顺序 2.js事件委托。通过on绑定的事件属于事件委托机制，具体可以百度一下。原因大致就是因为普通的click，mouse事件绑定在先，js动态加载出来的DOM在后，所以实际上并没有成功绑定事件，所以无效