Nota
El acceso a esta página requiere autorización. Puede intentar iniciar sesión o cambiar directorios.
El acceso a esta página requiere autorización. Puede intentar cambiar los directorios.
La herramienta Cambios realiza un seguimiento de los cambios realizados en archivos CSS, JavaScript o HTML en DevTools. La herramienta Cambios está vacía hasta que abre archivos y los edita mediante la herramienta Orígenes, la herramienta Origen rápido o el panel Estilos de la herramienta Elementos.
La herramienta Cambios muestra los cambios que se realizarán en los archivos de origen reales después de haber usado correctamente DevTools para modificar una copia de los archivos de la página web que se envían desde el servidor:
Use la herramienta Cambios para mostrar rápidamente todos los cambios con el fin de volver a aplicar esos cambios a los archivos de origen reales en el editor de código fuente.
Abra la herramienta Cambios haciendo clic en el icono Más herramientas
En la barra de actividades o la barra de herramientas vista rápida , haga clic en el botón Más herramientas (
y, a continuación, seleccione Cambios:
La herramienta Cambios se abre en la barra de actividad o en el panel Vista rápida , en función de la barra de herramientas que haya usado.
Abra la herramienta Cambios mediante el menú Comando
Para abrir la herramienta Cambios mediante el menú Comando:
Para abrir el menú Comando, presione Ctrl+Mayús+P en Windows/Linux o Comando+Mayús+P en Mac.
Empiece a escribir los cambios. El comando Mostrar cambios está resaltado:
Presione Entrar. La herramienta Cambios se abre en el panel Vista rápida :
Vea también:
Interpretación de líneas agregadas, líneas eliminadas y diferencias en una línea
Cada archivo modificado aparece en el panel lateral. Al seleccionar un archivo se muestran las modificaciones como una diff vista. No verá todo el archivo, pero solo las líneas que han cambiado, junto con algunas líneas por encima y por debajo de las líneas modificadas, para el contexto.
En la siguiente vista de diferencias se muestra que hubo dos modificaciones en diferentes partes de un archivo. Un cambio es una inserción y un cambio son varias líneas eliminadas:
| Tipo de cambio | Indicador |
|---|---|
| Línea eliminada | Cada línea que se quitó del código va precedida de un - color rojo. |
| Línea agregada | Cada nueva línea tiene un + frente y es de color verde. |
| Línea modificada | Un par adyacente de líneas, con una - línea y, a continuación, una + línea. |
Los cambios se representan como inserción o eliminación de líneas de código individuales, en las dos columnas de números de línea. La columna izquierda representa números de línea en el archivo antiguo y la columna derecha representa números de líneas en el nuevo archivo.
Abrir un archivo modificado en la herramienta Orígenes
Al hacer clic en una línea modificada en la herramienta Cambios , se abre el archivo en la herramienta Orígenes , desplazado a la línea modificada.
Revertir cambios
Para deshacer todos los cambios, en la parte inferior de la herramienta Cambios , haga clic en el botón Revertir todos los cambios al archivo actual (
):
Entradas de desplazamiento horizontal
Cuando haya realizado un cambio en un archivo minificado, la herramienta Cambios le permite desplazarse horizontalmente para mostrar todo el código minificado:
Para desplazarse horizontalmente, haga clic en la barra de desplazamiento horizontal o presione las teclas de flecha izquierda o derecha.
Solución de problemas
Si los círculos verdes dejan de aparecer en los archivos de DevTools, como en la pestaña Área de trabajo ; o si la herramienta Cambios no muestra los cambios esperados:
- Con DevTools mostrado, haga clic con el botón largo o haga clic con el botón derecho en el botón Actualizar de Microsoft Edge y, a continuación, seleccione Caché vacía y actualización rígida.