CODEWITHSUNDEEP
jqueryencodinghtml-parsingcdatahtml-encode
Ankit
Ankit

Reputation: 6634

HTML tags encoded when appending CDATA tag

In my page, there is a div in which I have to display html from javascript. So in javascript, I append the CDATA tags so that the html is displayed as data. Following is the code I have used

var htmlCode = '<h>testing html</h>';
htmlCode = '<![CDATA[' + htmlCode+ ']]>';
$('myDiv').html(htmlCode);

This actually displays testing html]]> as the last > is converted into &gt; when I assign it to the html of the div. Any idea how to overcome this problem

Thanks in advance

Upvotes: 0

Views: 2975

Answers (1)

gen_Eric
gen_Eric

Reputation: 227180

CDATA is used in XML files. it means the content inside is treated as text. jQuery's .html() turns <![CDATA[<h into <!--[CDATA[<h-->, which is a comment. It then ignores the closing </h> tag as the opening one is missing. So, it displays testing html]]>.

If you want to display HTML as text, just use .text() instead of .html(). It will escape it for you, so that it won't be parsed by the browser.

var htmlCode = '<h>testing html</h>';
$('#myDiv').text(htmlCode);

EDIT: You said you wanted the HTML to be parsed, then just use.html.

var htmlCode = '<h>testing html</h>';
$('#myDiv').text(htmlCode);

The CDATA is not needed in either case.

Upvotes: 3

Related Questions