1.什么是事件冒泡?
事件冒泡就是从具体到不具体,
例如:当你给了一个button按钮一个点击事件,再给他的父级相同的事件,就会按照,button,body,document,window,继续向上冒泡。
2。什么是事件捕获?
从不具体到具体,跟事件冒泡刚好相反。window document body button 。
例如:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <style> * { margin: 0; padding: 0; list-style: none; } #box { width: 100px; height: 100px; background: red; position: absolute; left: 0; top: 0; } </style> <script> window.onload = function () { var oBtn = document.getElementById(‘btn‘); oBtn.setCapture(); oBtn.onclick = function(){ alert(‘1‘); } } </script> </head> <body> <input type="button" value="按钮" id="btn"> </body> </html>
3.Dom事件流包括三个阶段。
1.>事件捕获阶段
2.>处于目标阶段
3.>事件冒泡阶段
4.事件捕获阶段
window.addEventListener(‘click‘,function(){
},true)
为true代表事件使用事件捕获模式,false则代表使用事件冒泡
5.阻止事件冒泡 stopPropagation()
时间: 2024-12-16 04:57:42