Para empezar, haz clic con el botón derecho (Ctrl+clic) en un elemento HTML en el inspector del DOM y observa el menú contextual. Las opciones disponibles en el menú varían según el navegador, pero en su mayoría, las más importantes son las mismas:
- Eliminar nodo (A veces _Eliminar elemento_). Elimina el elemento actual.
- Editar como HTML (A veces _Agregar atributo_/_Editar texto_). Te permite cambiar el HTML y ver los resultados en tiempo real. Muy útil para depurar y probar.
- :hover/:active/:focus. Obliga a que se activen los estados de los elementos, para que puedas ver cómo se vería su estilo.
- Copiar/Copiar como HTML. Copie el HTML seleccionado actualmente.
- Algunos navegadores también disponen de Copiar ruta CSS y _Copiar XPath_, para permitirte copiar el selector CSS o la expresión XPath que seleccionaría el elemento HTML actual.
Intenta editar algo de tu DOM ahora. Haz doble clic en un elemento o haz clic con el botón derecho del mouse y selecciona Editar como HTML en el menú contextual. Puedes realizar los cambios que desees, pero no los puedes guardar.