Beispielcode für die HTML-Formatierung von JSON
|
Ohne weitere Umschweife werde ich den Code direkt für Sie posten. Der spezifische Code lautet wie folgt:
<!DOCTYPE html>
<html>
<Kopf>
<meta charset="utf-8">
<title>JS Bin</title>
<link rel="stylesheet" href="https://rawgithub.com/yesmeck/jquery-jsonview/master/dist/jquery.jsonview.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<script type="text/javascript" src="https://rawgithub.com/yesmeck/jquery-jsonview/master/dist/jquery.jsonview.js"></script>
<Skripttyp="text/javascript">
var json = {"hey": "Typ", "eine Nummer": 243,"anobject": {"whoa": "verrückt", "anarray": [1,2,"drei<h1>ee"],"anotherarray": [1, 2], "mehr": "Zeug"},"super": wahr,"falsch": falsch,"Bedeutung": null, "japanisch": "明日がある。", "link": "http://jsonview.com", "nichtLink": "http://jsonview.com ist großartig"};
$(Funktion() {
$('#json').JSONView(json);
$('#collapse-btn').on('klicken', function() {
$('#json').JSONView('zusammenklappen');
});
$('#expand-btn').on('klicken', function() {
$('#json').JSONView('erweitern');
});
$('#toggle-btn').on('klicken', function() {
$('#json').JSONView('umschalten');
});
$('#toggle-level1-btn').on('klicken', function() {
$('#json').JSONView('umschalten', 1);
});
$('#toggle-level2-btn').on('klicken', function() {
$('#json').JSONView('umschalten', 2);
});
});
</Skript>
</Kopf>
<Text>
<br/>
<button id="collapse-btn">Zusammenklappen</button>
<button id="expand-btn">Erweitern</button>
<button id="toggle-btn">Umschalten</button>
<button id="toggle-level1-btn">Ebene 1 umschalten</button>
<button id="toggle-level2-btn">Ebene 2 umschalten</button> <div id="json"></div>
</body>
</html>Wie in der Demo gezeigt, wird das formatierte JSON angezeigt Oben sehen Sie den vom Herausgeber eingeführten Beispielcode für HTML-formatiertes JSON. Ich hoffe, er ist für alle hilfreich. Wenn Sie Fragen haben, hinterlassen Sie mir bitte eine Nachricht und der Herausgeber wird Ihnen rechtzeitig antworten. Ich möchte auch allen für ihre Unterstützung der Website 123WORDPRESS.COM danken! |
<<: Aktivieren oder Deaktivieren des GTID-Modus in MySQL online
Artikel empfehlen
Implementierung des Tomcat-Bereitstellungsprojekts und Integration mit IDEA
Inhaltsverzeichnis 3 Möglichkeiten zum Bereitstel...
Detaillierte Erläuterung zur Verwendung von Docker zum Bereitstellen der Django + MySQL8-Entwicklungsumgebung
Ich habe das System vor einiger Zeit neu installi...
Natives js zum Erreichen eines einfachen Karusselleffekts
In diesem Artikel wird der spezifische Code von j...
Zusammenfassung der in MySQL häufig verwendeten SQL-Anweisungen zum Erstellen von Tabellen, Hinzufügen von Feldern, Ändern von Feldern und Hinzufügen von Indizes
Dieser Artikel beschreibt anhand von Beispielen d...
Lernen Sie MySQL auf einfache Weise
Vorwort Die Datenbank war schon immer meine Schwa...
Probleme bei der Installation von MySQL 8.0 und beim Zurücksetzen des Kennworts
Mysql 8.0 Installationsprobleme und Passwort-Rese...
Detaillierte Erklärung zur Verwendung des scp-Befehls zum Remote-Kopieren von Dateien unter Linux
Vorwort scp ist die Abkürzung für „Secure Copy“. ...
Einführung in vierzehn Fälle von SQL-Datenbank
Datenblatt /* Navicat SQLite-Datenübertragung Que...
Analyse der HTTP-Dienstschritte auf einer virtuellen VMware-Maschine
1. Verwenden Sie xshell, um eine Verbindung mit d...
Detaillierte Erläuterung der ActiveMQ-Bereitstellungsmethode in der Linux-Umgebung
Dieser Artikel beschreibt die Bereitstellungsmeth...
CentOS6.8 verwendet cmake zur Installation von MySQL5.7.18
Unter Bezugnahme auf die Online-Informationen hab...
Detaillierte Erläuterung der MySQL-Existes- und Not-Existes-Beispiele
Detaillierte Erläuterung der MySQL-Existes- und N...
Implementierung der Änderung von Konfigurationsdateien im Docker-Container
1. Betreten Sie den Container docker run [Option]...
Keine chinesische Spezialität: Webentwicklung unter kulturellen Unterschieden
Webdesign und -entwicklung sind harte Arbeit, als...
onfocus="this.blur()" wird von blinden Webmastern gehasst
Als er über die Seite zur Bedienung der Bildschir...