Dom which element has focus

If you need to remove the activeElement you can use blur; document. It will change the activeElement to body. As said by JW, you can't find the current focused element, at least in a browser-independent way.

But if your app is IE only some are It looks like IE did not have everything wrong after all, this is part of HTML5 draft and seems to be supported by the latest version of Chrome, Safari and Firefox at least. From: How to select an element that has focus on it with jQuery. You can fall back to querySelector if that is supported. It's also worth mentioning that document. The following code will work around this issue and fall back to querySelector giving a little better support.

An addition thing to note is the performance difference between these two methods. Querying the document with selectors will always be much slower than accessing the activeElement property. See this jsperf. By itself, document. You may want that behavior, or it may not matter e. Robustness Note : In the code where it the checks against document. If you're writing a library or something and want it to be robust, you should probably handle that somehow. Here's a heavy airquotes "one-liner" version of getting the focused element, which is conceptually more complicated because you have to know about short-circuiting, and y'know, it obviously doesn't fit on one line, assuming you want it to be readable.

I'm not gonna recommend this one. But if you're a hax0r, idk You could also remove the null part if you don't mind getting false in some cases. You could still get null if document.

For checking if a specific element is focused, alternatively you could use events, but this way requires setup and potentially teardown , and importantly, assumes an initial state :. You could fix the initial state assumption by using the non-evented way, but then you might as well just use that instead. Additionally, if an element is focused and the browser window is blurred, activeElement will continue to hold the focused element.

If either of these two behaviors are not desirable, consider a CSS-based approach: document. I have found the following snippet to be useful when trying to determine which element currently has focus.

Copy the following into the console of your browser, and every second it will print out the details of the current element that has focus. Feel free to modify the console. This way you can check if element has focus with el. I liked the approach used by Joel S, but I also love the simplicity of document. I used jQuery and combined the two. Older browsers that don't support document. Newer browsers will use document. I assume that document. JQuery does support the :focus pseudo-class as of current.

Here is an example assuming you've assigned an id to the element that has focus:. If you want to get a object that is instance of Element , you must use document. If the user focuses on an inner-div, then document. You cannot use document. Use document. Related links: activeElement Browser Compatibility jQuery alternative for document.

If you can use jQuery, it now supports :focus, just make sure you are using version 1. This statement will get you the currently focused element. Tags: Javascript Dom. Copyright by Refsnes Data. All Rights Reserved. W3Schools is Powered by W3. This way, if startFocusTracking has been called on a given element, you can use el. If there is no focusable element, the document. In addition, if an element is focused and the browser window is blurred, the active element will continue to retain the focused element.

If neither behavior is ideal, consider a CSS based approach: document. Queryselector ': focus'.