'Does querySelector on an Event Object search the DOM?
Here's the question in more detail. Say, you have an event handler
const eventHandy = (e) =>{
//do stuff;
}
Within eventHandy, you run a querySelector on e.target
const eventHandy = (e) =>{
e.target.querySelectorAll("div");
}
The question is does this querySelector do a query on the DOM or the event object e.target?
For context, and without getting too much into details; we have a react app. We are doing some stuff with accessibility and focus. Part of our code is finding focusable elements. On one side of the debate, doing DOM queries inside of a React app is an anti-pattern, and therefore should be avoided at all cost. On the other side, there are times when DOM queries are necessary and shouldn't be discounted. However, there is a portion of code that gets an event object and runs querySelectorAll.. This is a sticking point for some of our developers.
Solution 1:[1]
querySelector does a query on the event object e.target and will find all elements within the target, not on the parent document.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | Rajneesh Chaurasia |
