The first of this article is as a note to do a comprehensive review of the knowledge points.There are many event streams on the second website, so I will not explain the details that I have already understood, and only record the part of my doubts.
General concepts:
- What is event flow?
- What is the sequence of events?
捕获--目标--冒泡 - How about compatibility?
ie8及以下不支持捕获. - A small history of compatibility?
刚开始其他支持捕获,而ie非支持冒泡.后来w3c支持捕获--目标--冒泡,而ie8头铁还不支持捕获,直到ie9才改变 - The principle of event delegation?
冒泡+event,target实现.
Key concept
- How to create capture and bubbling events?
除了addeventlistener,且参数为true,其他都是冒泡. - How to stop capturing and bubbling events?
event.stopPropagation(): 阻止冒泡和捕获
event.preventDefault(). 阻止默认事件.
return false: 阻止冒泡和捕获以及阻止默认事件. - What is the use of jquery events? And the advantages and disadvantages:
bind\live\delegete\on(推荐) - How to use native code events?
el.addEventListener("click", function(e){
console.log('add');
}, true/false);
el.onclick = function(e){
console.log("onclick");
}
<a href="javascript:;" onclick="hello()" />
<script>
function hello(){
console.log("hello")
}
</script>
- The real order of capture:
window-document-body-div-body-document-window
Reference:
event binding, event bubbling and capture, event delegation (specific analysis)