addEventListener事件監聽裡寫法有三個參數,分別為1.選擇事件、2.帶入function、3.true或false。
// 第三個參數為 false
addEventListener('click',function(),false);
// 第三個參數為 true
addEventListener('click',function(),true);
<body class="body">
<ul>
<li><a href="#">1234</a></li>
<li><a href="#">1234</a></li>
</ul>
<div class="box"></div>
<script src="js/all.js"></script>
</body>
const el = document.querySelector('.box');
el.addEventListener('click',function(){
alert('box');
console.log('box');
},false);
const elBody = document.querySelector('.body');
elBody.addEventListener('click',function(){
alert('body');
console.log('body');
},false);
// 將上面程式碼 false 同時換成 true 則找尋方向會不同。
<body class="body">
<ul>
<li><a href="#">1234</a></li>
<li><a href="#">1234</a></li>
</ul>
<div class="box"></div>
<script src="js/all.js"></script>
</body>
const el = document.querySelector('.box');
el.addEventListener('click',function(){
e.stopPropagation(); //中止冒泡語法
alert('box');
console.log('box');
},false);
const elBody = document.querySelector('.body');
elBody.addEventListener('click',function(){
alert('body');
console.log('body');
},false);
今天就到這結束了。