DevToolPal
ES

Editor de JSON en árbol

Visualiza JSON como un árbol plegable y edita claves, valores y tipos en el sitio, con el JSON actualizado al momento.

Se ejecuta en local, nunca se sube

Opciones

Sangría

JSON

0 caracteres · 0 B

Árbol

El resultado aparece aquí

Qué hace

El editor de JSON en árbol convierte un documento JSON en un árbol plegable que puedes recorrer y editar directamente. En lugar de buscar una coma perdida en un archivo de texto largo, cambias un valor en un pequeño campo y la herramienta reescribe JSON válido por ti.

Es práctico para archivos de configuración, respuestas de API, fixtures de tests y archivos de traducción: cualquier cosa en la que primero necesites entender la estructura y después hacer unos pocos cambios precisos.

Cómo se usa

  1. Pega el JSON en la entrada de la izquierda o carga el ejemplo.
  2. Explora el árbol. Haz clic en la flecha junto a un objeto o array para desplegarlo o plegarlo, y usa Niveles desplegados para elegir hasta qué profundidad se abre el árbol por defecto.
  3. Edita en el sitio:
    • Haz clic en una clave para renombrarla. Las claves mantienen su posición en el objeto.
    • Haz clic en una cadena o un número para cambiarlo. Los booleanos tienen un menú con true o false.
    • Usa el menú de tipo a la derecha de cada fila para convertir un valor en otro tipo JSON.
    • Pulsa + para añadir un hijo a un objeto o array, o × para eliminar un nodo.
  4. Pulsa Enter o haz clic en otro sitio para aplicar un cambio, o Escape para cancelarlo.
  5. Copia el JSON actualizado desde la entrada. La opción Sangría controla cómo se formatea.

Rutas

Al seleccionar una fila se muestra su ruta en estilo JSONPath, como $.author.name o $.keywords[2], con un botón para copiarla. Las claves que no son identificadores simples se entrecomillan, por ejemplo $["first name"]. Las rutas son útiles cuando escribes código o consultas que leen el mismo campo, por ejemplo con jq, el encadenamiento opcional de JavaScript o una función JSON de una base de datos.

Edición segura

Las ediciones nunca producen JSON no válido. Si un cambio no se puede aplicar, por ejemplo renombrar una clave a otra que ya existe o escribir letras en un número, la herramienta muestra un mensaje encima del árbol y deja tu documento sin cambios.

Si el JSON de la izquierda contiene un error de sintaxis, el árbol se sustituye por el error con su línea y columna, para que puedas corregir el texto y seguir.

Preguntas frecuentes

› ¿Mis cambios se guardan en el texto JSON?

Sí. Cada cambio en el árbol se escribe directamente en el JSON de la izquierda, formateado con la sangría que hayas elegido, así que puedes copiarlo o descargarlo en cualquier momento.

› ¿Cómo añado o quito elementos?

Usa el botón más de una fila de objeto o array para añadir un hijo, y el botón de cruz de cualquier fila para eliminarla. Los nuevos miembros de un objeto reciben una clave provisional como key o key2 que puedes renombrar.

› ¿Qué pasa cuando cambio un tipo?

La herramienta conserva todo lo que puede. Un número se convierte en su texto al pasarlo a cadena, un array se convierte en un objeto con los índices como claves y un objeto se convierte en un array con sus valores.

› ¿Se sube mi JSON?

No. El análisis y la edición se hacen en tu navegador.