Karan
42 lines
1.0 KiB
Plaintext
42 lines
1.0 KiB
Plaintext
<!doctype html>
|
||
<html>
|
||
<head>
|
||
<title>JS Tester</title>
|
||
<style>
|
||
.box {
|
||
width: 200px;
|
||
height: 100px;
|
||
border: 1px solid black
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="container">
|
||
<div class="box" id="box0">Box #1</div>
|
||
<div class="box" id="box1">Box #2</div>
|
||
<div class="box" id="box2">Box #3</div>
|
||
<div class="box" id="box3">Box #4</div>
|
||
</div>
|
||
<script>
|
||
const main = document.querySelector(".container");
|
||
const boxes = document.querySelectorAll(".box");
|
||
main.addEventListener("click", (e) => {
|
||
console.log("4");
|
||
},false);
|
||
main.addEventListener("click", (e) => {
|
||
console.log("1");
|
||
},true);
|
||
|
||
boxes.forEach(ele => {
|
||
ele.addEventListener("click", (e) => {
|
||
console.log("3");
|
||
},false);
|
||
ele.addEventListener("click", (e) => {
|
||
console.log("2");
|
||
},true);
|
||
|
||
})
|
||
</script>
|
||
</body>
|
||
</html>
|