Zum Hauptinhalt springen
ToolsByUs

JSON-Editor

Der JSON-Editor bietet eine synchronisierte Editierumgebung mit zwei Oberflächen: einer interaktiven Baumansicht und einem Live-Texteditor mit Monospace-Schrift. Er unterstützt die Bearbeitung von Knoten direkt im Baum, das Hinzufügen, Umbenennen und Löschen von Schlüsseln, das Umordnen von Arrays, die Navigation durch Undo- und Redo-Verlauf sowie JSONPath-Suche nach Eigenschaften mit fortlaufender Prüfung der Syntax nach RFC 8259.

Nur lokal
Interaktiver JSON-BaumWerte anklicken und direkt bearbeiten
JSON-Dokument einfügen oder auf „Beispiel testen“ klicken, um Eigenschaften visuell zu bearbeiten.
Synchronisierter Code-Editor
0 B1 ZeileZ. 1, Sp. 1

Wie funktioniert JSON-Editor?

Wer verschachtelte JSON-Payloads im Rohtext bearbeitet, produziert schnell Syntaxschäden: Ein versehentlich fehlendes Komma oder eine nicht geschlossene geschweifte Klammer bricht die ganze Datei. Der JSON-Editor von ToolsByUs eliminiert das, indem er eine AST-gestützte visuelle Baumansicht mit einem Rohtext-Editor kombiniert:

  • Bidirektionale Synchronisation: Tippen im Code-Feld parst und aktualisiert die Baumhierarchie live. Umgekehrt wird jeder Klick auf einen Knoten, jede geänderte Eigenschaftsbezeichnung oder jedes im Baum hinzugefügte Element sofort zurück in sauberen, eingerückten JSON-Text serialisiert.
  • Sichere, typenerhaltende Änderungen: Beim Bearbeiten von skalaren Knoten parst der Editor Strings, Zahlen, Booleans und null in ihre exakten JavaScript-Darstellungen, ohne Zahlen in Strings umzuwandeln.
  • JSONPath-Eigenschaftsabfragen: Filtern Sie tief verschachtelte Dokumente sofort über Eigenschaftsnamen oder Pfade in Punktnotation, um sich auf relevante Schlüssel zu konzentrieren.
  • Unbegrenztes Undo/Redo: Jeder Tastendruck und jede Baumänderung landet auf einem unveränderlichen Verlaufs-Stack, sodass Sie Änderungen bedenkenlos zurückrollen können.

JSON-Rohdokument

{"server": "node-1", "active": false}

Beispielausgabe

// Mutated via Tree: Toggle 'active' to true and add 'port': 8080
{
  "server": "node-1",
  "active": true,
  "port": 8080
}

Welche Optionen und Sonderfälle unterstützt JSON-Editor?

Technische Referenz und Optionen
ParameterTypStandardVerhalten & Sonderfälle
Inline-Bearbeitung von SchlüsselnAktionKlicken zum BearbeitenKlicken Sie auf jeden Eigenschaftsschlüssel in der Baumansicht, um ihn im gesamten Dokument umzubenennen.
Inline-Bearbeitung von WertenAktionKlicken zum BearbeitenBearbeiten Sie skalare Werte direkt. Booleans werden durch einen Klick umgeschaltet; Zahlen bleiben Zahlen.
Kind hinzufügenAktion+ SchaltflächeFügt ein neues Attribut zu Objekten hinzu oder hängt ein neues Element an Arrays an.
Knoten löschenAktionPapierkorb-SchaltflächeEntfernt sicher ein Schlüssel-Wert-Paar oder einen Array-Index, ohne nachfolgende Kommas zu hinterlassen.
Rückgängig / WiederholenVerlaufLinearer StapelErhält den vollständigen Verlaufszustand bei Text- und Baumoperationen.

Häufig gestellte Fragen

Kann ich frei zwischen Baumansicht und Textansicht wechseln?

Ja! Sie können beide gleichzeitig nebeneinander anzeigen oder über die Ansicht-Tabs zwischen Vollbild-Baumansicht und Vollbild-Textansicht umschalten.

Was passiert, wenn ich in der Textansicht ungültiges JSON eintippe?

Der Editor zeigt sofort ein Syntaxfehler-Banner mit Zeile, Spalte und Caret-Position an und behält dabei den letzten gültigen Baumzustand bei, damit Ihr Workflow nie unterbrochen wird.

Wird mein bearbeitetes JSON auf irgendeinem externen Server gespeichert?

Nein. Sämtliches Parsing, Baum-Rendering und Serialisieren läuft vollständig im Browserspeicher. Es werden niemals Daten gespeichert oder irgendwohin übertragen.

Warum lässt sich mein JSON nicht parsen, obwohl es korrekt aussieht?

Drei Ursachen erklären fast alles: ein Komma hinter dem letzten Element, einfache Anführungszeichen, wo JSON doppelte verlangt, und geschweifte „typografische Anführungszeichen“, aus einer Textverarbeitung oder einem Chat-Client eingefügt. Das Fehler-Banner nennt Zeile und Spalte des ersten fehlerhaften Zeichens, und dort sollten Sie suchen – der Fehler liegt meist eine Zeile über der Stelle, an der Sie ihn vermuten.

Wie groß darf ein JSON-Dokument sein, das ich hier bearbeite?

Bis zu 8 MB. Die Bearbeitung läuft im Main-Thread der Seite, damit der Baum Ihrem Tippen folgen kann, und oberhalb dieser Größe hört ein Browser-Tab auf, sich neu zu zeichnen, statt die Arbeit zu beenden. Das Tool lehnt das Dokument mit einer klaren Meldung ab, statt einzufrieren; für Größeres läuft das JSON-Diff-Tool in einem Web Worker und akzeptiert weit mehr.

Ordnet die Bearbeitung meine Schlüssel neu oder formatiert das Dokument um?

Nein. Schlüssel behalten die Reihenfolge, in der sie ankamen, und die Textansicht gibt exakt das zurück, was Sie getippt haben, Leerraum inklusive. Neu formatiert wird nur, wenn Sie es anderswo verlangen – der JSON-Formatter ist das Tool, das gezielt einrückt, Schlüssel sortiert und Kommentare entfernt.

ToolsByUs-Team · Wie wir unsere Tools prüfen