THIS in Event Listener

THIS in Event Listener

December 13, 2024

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>This in event listener</title>
</head>
<body>
    <h1>This in event listener</h1>
    <h3>Demoo for event listener</h3>
    <p>This is a paragraph</p>
    <script src="ThisInEventListener.js"></script>
</body>
</html>

CSS

let h1 = document.querySelector("h1");
let h3 = document.querySelector("h3");
let p = document.querySelector("p");

function change(){
console.dir(this);
console.dir(this.innerText);
this.style.backgroundColor="aqua";
}
h1.addEventListener("click",change);
h3.addEventListener("click",change);
p.addEventListener("click",change);

Comments