js中addEventListener中第3個引數 更多的情況研究
阿新 • • 發佈：2019-01-27
借用其他兄弟的成果擴充套件一下
<div id="id1" style="width:200px; height:200px; position:absolute; top:100px; left:100px; background-color:blue; z-index:4;border:1px solid #f00;">d1 <div id="id2" style="width:200px; height:200px; position:absolute; top:20px; left:70px; background-color:green; z-index:1;border:1px solid #f00;">d2 <div id="id3" style="width:200px; height:200px; position:absolute; top:20px; left:70px; background-color:red; z-index:1;border:1px solid #f00;">d3 </div> </div> </div>
這裡採用了三個監聽：
document.getElementById('id1').addEventListener('click', function() { console.log('id1==false');}, false); document.getElementById('id2').addEventListener('click', function() { console.log('id2==false');}, false); document.getElementById('id3').addEventListener('click', function() { console.log('id3==true');}, true);
關於第三個引數的設定以及最後冒泡的順序問題，大致規律可以這麼看，如果有更多的監聽，那麼首先將第三個引數為true的所有監聽分為一組放在冒泡的前部，為false的放在後部，即，為true的先響應事件，為FALSE的後響應事件，為true的部分，按照從最外層到最裡層的順序響應，為false的部分按照從裡層到外層的順序響應，這就得到最後的響應順序，如上例最後的結果是：d3,d2,d1