I know that I can use $.html to set the HTML content of something, and $.text to set the content (and that this escapes the HTML).
Unfortunately, I'm using $.append, which doesn't escape the HTML.
I've got something like this:
function onTimer() {
$.getJSON(url, function(data) {
$.each(data, function(i, item) {
$('#messages').append(item);
}
}
}
...where the url returns an array of strings. Unfortunately, if one of those strings is (e.g.) alert('Hello'), this gets executed.
How do I get it to escape HTML?
解决方案
Check out how jQuery does it:
text: function( text ) {
if ( typeof text !== "object" && text != null )
return this.empty().append( (this[0] && this[0].ownerDocument || document).createTextNode( text ) );
var ret = "";
jQuery.each( text || this, function(){
jQuery.each( this.childNodes, function(){
if ( this.nodeType != 8 )
ret += this.nodeType != 1 ?
this.nodeValue :
jQuery.fn.text( [ this ] );
});
});
return ret;
},
So something like this should do it:
$('#mydiv').append(
document.createTextNode('Hey There!')
);
EDIT: Regarding your example, it's as simple as:
$('#messages').append(document.createTextNode(item));