javascript - Decode html in json - Stack Overflow

admin管理员组

文章数量:1307005

I have html in json which has already been encoded (by c#) to :

{"itemID":6,"GlossaryWord":"ante","GlossaryDescription":"\u003cp\u003e\r\n\t\u003cstrong\u003eUp the ante\u0026nbsp;\u003c/strong\u003e\u003c/p\u003e\r\n\u003cul\u003e\r\n\t\u003cli\u003e\r\n\t\t\u003cstrong\u003eHere\u003c/strong\u003e\u003c/li\u003e\r\n\t\u003cli\u003e\r\n\t\t\u003cstrong\u003eis\u0026nbsp;\u003c/strong\u003e\u003c/li\u003e\r\n\t\u003cli\u003e\r\n\t\t\u003cb\u003esomething\u003c/b\u003e\u003c/li\u003e\r\n\u003c/ul\u003e\r\n","CategoryID":6}

But how would I decode GlossaryDescription in JavaScript/AngularJS so that it displays the html tags like <p> & <strong> etc? Thanks as always :)

I have html in json which has already been encoded (by c#) to :

{"itemID":6,"GlossaryWord":"ante","GlossaryDescription":"\u003cp\u003e\r\n\t\u003cstrong\u003eUp the ante\u0026nbsp;\u003c/strong\u003e\u003c/p\u003e\r\n\u003cul\u003e\r\n\t\u003cli\u003e\r\n\t\t\u003cstrong\u003eHere\u003c/strong\u003e\u003c/li\u003e\r\n\t\u003cli\u003e\r\n\t\t\u003cstrong\u003eis\u0026nbsp;\u003c/strong\u003e\u003c/li\u003e\r\n\t\u003cli\u003e\r\n\t\t\u003cb\u003esomething\u003c/b\u003e\u003c/li\u003e\r\n\u003c/ul\u003e\r\n","CategoryID":6}

But how would I decode GlossaryDescription in JavaScript/AngularJS so that it displays the html tags like <p> & <strong> etc? Thanks as always :)

• javascript
• c#
• html
• json
• angularjs

Share Improve this question Follow edited Jul 7, 2015 at 16:37 taxicala 21.8k77 gold badges4040 silver badges6666 bronze badges asked Jul 7, 2015 at 16:34 CerIsCerIs 56733 gold badges66 silver badges1515 bronze badges 3

• 2 There is nothing special you have to do: jsfiddle/7cwowxr7. The string contains HTML, just do with it whatever you want to do (the \uxxxx escape sequences are already "decoded" by the JSON parser). – Felix Kling Commented Jul 7, 2015 at 16:42
• What code are you using to get the HTML from JSON and add it to the page? – Trisped Commented Jul 7, 2015 at 18:01
• AngularJS, im looping though the json and creating: <a class=\"gobig tooltip\" " + "title=\"" + data[i].GlossaryDescription + "\"> – CerIs Commented Jul 7, 2015 at 21:48

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 6

You don't need to do anything. The string "\u003cp\u003e" (for example) isn't actually encoded in a way that needs decoding—it's exactly equivalent to "<p>". If you type "\u003cp\u003e" == "<p>" in your console you'll see it return true. Since the "encoded" string is exactly the same as the non-"encoded" string, you can use them exactly the same way. Take a look:

var obj = {"itemID":6,"GlossaryWord":"ante","GlossaryDescription":"\u003cp\u003e\r\n\t\u003cstrong\u003eUp the ante\u0026nbsp;\u003c/strong\u003e\u003c/p\u003e\r\n\u003cul\u003e\r\n\t\u003cli\u003e\r\n\t\t\u003cstrong\u003eHere\u003c/strong\u003e\u003c/li\u003e\r\n\t\u003cli\u003e\r\n\t\t\u003cstrong\u003eis\u0026nbsp;\u003c/strong\u003e\u003c/li\u003e\r\n\t\u003cli\u003e\r\n\t\t\u003cb\u003esomething\u003c/b\u003e\u003c/li\u003e\r\n\u003c/ul\u003e\r\n","CategoryID":6};

document.write(obj.GlossaryDescription);

Try:

var htmlToUse = "<a class=\"gobig tooltip\" "
    + "title=\""
    + data[i].GlossaryDescription
    + "\">"
    + data[i].GlossaryWord.trim().toLowerCase()
    + ",</a>";
$('#HtmlParentContainer').html(htmlToUse);

As Jordan pointed out, you do not need to change the content of the fields. All you need to do is use JavaScript (and jQuery) to replace the existing HTML with the new HTML you generated. If you do not want to use JavaScript's innerHTML then you can use jQuery's html().

JSFiddle

Note: your GlossaryDescription field should not have HTML in it if you are applying it to an element attribute like title. Also, the code above acts as if data is an array, but your example does not. As a result, the JSFiddle drops the [i]

本文标签： javascriptDecode html in jsonStack Overflow