Schreibe HTML-String in Json

Sie können, nachdem Sie den HTML-Code korrekt entkommen haben . Diese Seite zeigt, was zu tun ist. 

Wenn Sie PHP verwenden, können Sie json_encode () verwenden.

Hoffe das hilft :)

Kodieren Sie einfach HTML mit dem Base64-Algorithmus, bevor Sie HTML zum JSON hinzufügen, und dekodieren Sie HTML mit Base64, wenn Sie lesen.

byte[] utf8 = htmlMessage.getBytes("UTF8");
htmlMessage= new String(new Base64().encode(utf8));


byte[] dec = new Base64().decode(htmlMessage.getBytes());
htmlMessage = new String(dec , "UTF8");

Es ist möglich, einen HTML-String in JSON zu schreiben. Sie müssen nur Ihre Anführungszeichen umgehen.

[
    {
        "id": "services.html",
        "img": "img/SolutionInnerbananer.jpg",
        "html": "<h2class=\"fg-white\">AboutUs</h2><pclass=\"fg-white\">CSMTechnologiesisapioneerinprovidingconsulting,
        developingandsupportingcomplexITsolutions.Touchingmillionsoflivesworldwidebybringingininnovativetechnology,
        CSMforayedintotheuntappedmarketslikee-GovernanceinIndiaandAfricancontinent.</p>"
    }
]

Der einfachste Weg ist, den HTML-Code in einfache Anführungszeichen zu setzen. Und das modifizierte Json-Objekt sieht folgendermaßen aus:

[
    {
        "id": "services.html",
        "img": "img/SolutionInnerbananer.jpg",
        "html": '<h2 class="fg-white">AboutUs</h2><p class="fg-white">developing and supporting complex IT solutions.Touchingmillions of lives world wide by bringing in innovative technology </p>'
    }
];

Fiddle .

Die beste Möglichkeit ist, die doppelten Anführungszeichen und andere Zeichen mit Escapezeichen zu versehen. Das modifizierte Json-Objekt sieht folgendermaßen aus:

[
    {
        "id": "services.html",
        "img": "img/SolutionInnerbananer.jpg",
        "html": "<h2 class=\"fg-white\">AboutUs</h2><p class=\"fg-white\">developing and supporting complex IT solutions.Touchingmillions of lives world wide by bringing in innovative technology </p>"
    }
];

Fiddle .

Nehmen wir an, ich versuche, den folgenden HTML-Code zu rendern.

let myHTML = "<p>Go to this <a href='https://google.com'>website </b></p>";

JSON.parse(JSON.stringify(myHTML)) Damit erhalten Sie ein HTML-Element, das Sie mit innerHTML setzen können.

So document.getElementById("demo").innerHTML = JSON.parse(JSON.stringify(myHTML));

Die Leute speichern ihren HTML-Code als Objekt hier . Die von mir vorgeschlagene Methode funktioniert jedoch genauso, ohne ein Objekt verwenden zu müssen.

Sie sollten auch den Schrägstrich entziehen, hier ist der richtige JSON:

[{
"id": "services.html",
"img": "img/SolutionInnerbananer.jpg",
"html": "<h2class=\"fg-white\">AboutUs<\/h2><pclass=\"fg-white\">developing and supporting complex IT solutions.Touchingmillions of lives world wide by bringing in innovative technology <\/p>"
}]

4 Dinge, die Sie tun müssen, wenn Sie HTML in JSON einfügen:

1) Escape-Anführungszeichen für HTML-Attribute wie folgt <img src=\"someimage.png\" />

2) Verbergen Sie den Schrägstrich in HTML-End-Tags. <div>Hello World!<\/div>. Dies ist ein uraltes Artefakt einer alten HTML-Spezifikation, bei der HTML-Parser nicht verwirrt werden sollten, wenn Zeichenfolgen in ein <SCRIPT> - Tag eingefügt werden. Aus irgendeinem Grund gefällt es den heutigen Browsern immer noch.

3) Dieser war total bizarr. Sie sollten bei selbstschließenden Tags ein Leerzeichen zwischen dem Tag-Namen und dem Schrägstrich einfügen. Ich habe keine Ahnung, warum das so ist, aber in den meisten modernen Browsern, wenn Sie versuchen, mit Javascript ein <li> - Tag als untergeordnetes Element einer ungeordneten Liste anzuhängen, die folgendermaßen formatiert ist: <ul/> wird nicht funktionieren. Es wird nach dem ul-Tag zum DOM hinzugefügt. Wenn der Code jedoch wie folgt aussieht: <ul /> (Beachten Sie das Leerzeichen vor dem /), funktioniert alles einwandfrei. Sehr seltsam.

4) Stellen Sie sicher, dass Sie alle Anführungszeichen codieren, die in (fehlerhaften) HTML-Inhalten enthalten sein können. Dies ist das einzige, was den JSON wirklich zum Erliegen bringt, wenn der String versehentlich vorzeitig beendet wird. Alle Zeichen " Sollten als " Codiert werden, wenn sie als HTML-Inhalt enthalten sein sollen.

via

in json ist alles ein String zwischen doppelten Anführungszeichen ", also brauchen Sie ein Escape", wenn es im Wert vorkommt (nur beim direkten Schreiben), verwenden Sie einen Backslash \

und alles in der JSON-Datei, die in {} eingeschlossen ist, ändert Ihren JSON in

{
  [
    {
      "id": "services.html",
      "img": "img/SolutionInnerbananer.jpg",
      "html": "<h2 class=\"fg-white\">AboutUs</h2><p class=\"fg-white\">developing and supporting complex IT solutions.Touching millions of lives world wide by bringing in innovative technology</p>"
    }
  ]
}

Eine Möglichkeit besteht darin, die doppelten Anführungszeichen in HTML durch einfache Anführungszeichen zu ersetzen, die Verwendung von doppelten Anführungszeichen ist jedoch zur Standardkonvention für Attributwerte in HTML geworden.

Die bessere Option besteht darin, die doppelten Anführungszeichen in Json und anderen Zeichen, die maskiert werden müssen, zu umgehen.

Weitere Informationen zum Escaping finden Sie hier: Wo finde ich eine Liste der Escape-Zeichen, die für meinen JSON-Ajax-Rückgabetyp erforderlich sind?

Sie können den Bezeichner zu einem Parameter für einen Abfrageselektor machen. Verwenden Sie für PHP und kompatible Sprachen ein assoziatives Array (tatsächlich ein Objekt) und dann json_encode.

$temp=array('#id'  =>array('href'=>'services.html')
           ,'img'  =>array('src'=>"img/SolutionInnerbananer.jpg")
           ,'.html'=>'<h2 class="fg-white">AboutUs</h2><p class="fg-white">...</p>'
           );
echo json_encode($temp);  

Aber HTML macht es nicht ohne JS für Sie.

{"#id":{"href":"services.html"},"img":{"src":"img\/SolutionInnerbananer.jpg"}
 ,".html":"<h2 class=\"fg-white\">AboutUs<\/h2><p class=\"fg-white\">...<\/p>"}