The event target property
Whenever an event gets fired, an event variable becomes available. It has many properties, and you can check it out by using this command in the function that gets fired for the event:
console.dir(event);
This will show many properties. One of the most interesting properties for now is the target
property. The target is the HTML element that fired the event. So, we can use it to get information from a web page. Let's look at a simple example.
<!doctype html>
<html>
<body>
<button type="button" onclick="triggerSomething()">Click</button>
<script>
function triggerSomething() {
console.dir(event.target);
}
</script>
</body>
</html>
In this case, event.target
is the button
element. In the console, the button
element and all its properties will be logged, including potential siblings and parents.
A use case where parent...