Suponha que você esteja testando a acessibilidade de navegação por teclado de uma página. Ao navegar pela página com a tecla Tab, o anel de foco às vezes desaparece porque o elemento que tem foco está oculto. Para rastrear o elemento em foco no DevTools:
- Abra o Console.
Clique em Criar expressão ao vivo .
Para mais informações, consulte Observar valores de JavaScript em tempo real com as expressões ao vivo.
Digite
document.activeElement
.Clique fora da interface da Expressão ao vivo para salvar.
O valor abaixo de document.activeElement
é o resultado da expressão. Como essa
expressão sempre representa o elemento em foco, agora você tem uma maneira de sempre acompanhar qual
elemento tem o foco.
- Passe o cursor sobre o resultado para destacar o elemento em foco na janela de visualização.
- Clique com o botão direito do mouse no resultado e selecione Revelar no painel "Elements" para mostrar o elemento na árvore DOM no painel Elements.
- Clique com o botão direito do mouse no resultado e selecione Store as global variable para criar uma referência de variável ao nó que pode ser usado no Console.