SOURCE

console 命令行工具 X clear

                    
>
console
		var div1 = document.querySelector(".div1");
		var div2 = document.querySelector(".div2");
		var div3 = document.querySelector(".div3");
		var div4 = document.querySelector(".div4");
		div1.addEventListener("click",(e)=>{console.log("div1")},true);
		div2.addEventListener("click",(e)=>{console.log("div2")},false);
		div3.addEventListener("click",(e)=>{console.log("div3")},true);
		div4.addEventListener("click",(e)=>{console.log("div4")},false);
	<div class="div1">
		<div class="div2">
			<div class="div3">
				<div class="div4">
					
				</div>
			</div>
		</div>
	</div>
	*{
		box-sizing: border-box;
	}
	.div1, .div2, .div3, .div4{
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}
	.div1{
		width: 400px;
		height: 400px;
		background-color: #000000;
	}
	.div2{
		width: 300px;
		height: 300px;
		background-color: #ff0000;
	}
	.div3{
		width: 200px;
		height: 200px;
		background-color: #ffff00;
	}
	.div4{
		width: 100px;
		height: 100px;
		background-color: #ffffff;
	}