Home > Back-end >  Does querySelector on an Event Object search the DOM?
Does querySelector on an Event Object search the DOM?

Time:04-02

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.

CodePudding user response:

querySelector does a query on the event object e.target and will find all elements within the target, not on the parent document.

  • Related