En las herramientas para desarrolladores de Google Chrome, cuando selecciono un elemento, veo al ==$0
lado del elemento seleccionado. Qué significa eso?
En las herramientas para desarrolladores de Google Chrome, cuando selecciono un elemento, veo al ==$0
lado del elemento seleccionado. Qué significa eso?
Respuestas:
Es el último índice de nodo DOM seleccionado. Chrome asigna un índice a cada nodo DOM que seleccione. Por $0
lo tanto , siempre apuntará al último nodo que seleccionó, mientras que $1
apuntará al nodo que seleccionó antes. Piense en ello como una pila de nodos seleccionados más recientemente.
Como ejemplo, considere lo siguiente
<div id="sunday"></div>
<div id="monday"></div>
<div id="tuesday"></div>
Ahora abrió la consola de devtools y seleccionó #sunday
, #monday
y #tuesday
en el orden mencionado, obtendrá identificadores como:
$0 -> <div id="tuesday"></div>
$1 -> <div id="monday"></div>
$2 -> <div id="sunday"></div>
Nota: Puede ser útil saber que el nodo se puede seleccionar en sus scripts (o consola), por ejemplo, un uso popular para esto es el selector de elemento angular, por lo que simplemente puede elegir su nodo y ejecutar esto:
angular.element($0).scope()
Voila tienes acceso al alcance del nodo a través de la consola.
== $0
en la interfaz de usuario? Cualquiera que sepa $0
ya sabrá qué elemento es, y no tiene sentido para cualquiera que no lo sepa.
$ 0 devuelve el elemento u objeto JavaScript seleccionado más recientemente, $ 1 devuelve el segundo elemento seleccionado más recientemente, y así sucesivamente.
Las otras respuestas aquí explican claramente qué significa. Me gusta explicar su uso.
Puede seleccionar un elemento en la elements
pestaña y cambiar a la console
pestaña en Chrome. Simplemente escriba $0 or $1
o cualquier número y presione Entrar y el elemento se mostrará en la consola para su uso.
Internamente, Chrome mantiene una pila, donde $ 0 es el elemento seleccionado, $ 1 es el elemento que se seleccionó por última vez, $ 2 sería el que se seleccionó antes de $ 1 y así sucesivamente.
Estas son algunas de sus aplicaciones:
Diré que es solo una sintaxis abreviada para obtener referencia del elemento html durante el tiempo de depuración, normalmente este tipo de tarea se realizará mediante este método
document.getElementById , document.getElementsByClassName , document.querySelector
Por lo tanto, hacer clic en un elemento html y obtener una variable de referencia ($ 0) en la consola es un gran ahorro de tiempo durante el día
$0
en la consola y vea lo que aparece;)