¿Cómo puedo inspeccionar el elemento html que desaparece del DOM al perder el foco?
Estoy intentando inspeccionar las propiedades CSS desde una entrada en una celda de una tabla. La entrada aparece al hacer clic y desaparece al perder el foco, como cuando intento inspeccionarla. ¿Cómo puedo hacerlo para no perder el foco mientras me muevo a otra ventana (el inspector)?
En el navegador Chrome, abra Herramientas de desarrollador y seleccione la pestaña Elementos , luego abra el menú contextual del nodo principal del elemento que desea inspeccionar, en el menú contextual haga clic en Interrumpir > Modificaciones del subárbol .
Luego solo deberás hacer clic en la página y accederás al inspector sin perder el foco ni perder el elemento que deseas inspeccionar.
En la configuración de Chrome Devtools, hay una opción denominada Emulate a focused pageque está deshabilitada de forma predeterminada. Después de habilitar esta opción, si hace clic en cualquier lugar de la ventana devtool, no perderá el foco en ningún elemento del DOM.
Para la versión de Chrome >= 86:
- Haga clic derecho y elija
Inspect Elementabrir DevTools. O utilice uno de los siguientes atajos de teclado :- F12
- Control+ Shift+i
- Command+ Shift+i
- Haga clic
Consoleen en la barra de herramientas para abrir el panel de la consola. - Abra el panel Renderizado usando el menú de comandos y escribiendo
Show Rendering.- Control+ Shift+p
- Command+ Shift+p
- Hacer clic
Emulate a focused page - Haga clic en cualquier elemento para enfocarse y luego haga clic en cualquier lugar de la ventana devtool. Verías que ese elemento no pierde el foco. Ahora puedes inspeccionar o depurar fácilmente.
Para la versión de Chrome <86
Vaya a devtool settings -> preferencesy debajo de Globalla opción, habilite Emulate a focused page.
Si todo lo demás falla, escribe esto en la Consola:
setTimeout(() => { debugger; }, 5000)
Luego tienes 5 segundos (o cambia el valor a cualquier otra cosa) para que aparezca lo que quieras depurar.
Ninguna de las otras respuestas funcionó para mí: el árbol DOM siguió modificándose (es decir, las cosas que me importaban desaparecieron) justo antes de que el script se detuviera.
