Skip Navigation

Output focused elements to console

  • Javascript

If you copy this code and paste it into developer tools in your browser, you can use the "tab" key to move around different parts of a webpage. As you move around, the developer console will show you which part of the webpage is currently selected. This is really helpful when trying to find problems in complicated web applications where some parts might be hidden behind pop-up windows or other elements.

  • Copy the following snippet into the dev console or into the page source (Javascript) and view the dev console to see current focused element.
    Output focused elements in consolejavascript
    document.addEventListener('focusin', function() {
      console.log('focused: ', document.activeElement)
    }, true);