Удаление текста с помощью jQuery append?

Я знаю, что я могу использовать $.html для установки содержимого HTML-кода и $.text для установки содержимого (и это ускользает от HTML).

К сожалению, я использую $.append, который не выходит из HTML.

У меня есть что-то вроде этого:

function onTimer() {
    $.getJSON(url, function(data) {
        $.each(data, function(i, item) {
           $('#messages').append(item);
        }
    }
}

... где url возвращает массив строк. К сожалению, если одна из этих строк (например,) <script>alert('Hello')</script>, это выполняется.

Как мне заставить избежать HTML?

Ответы

Ответ 1

Посмотрите, как это делает jQuery:

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;
},

Итак, что-то вроде этого должно это сделать:

$('#mydiv').append(
    document.createTextNode('<b>Hey There!</b>')
);

EDIT. Что касается вашего примера, это просто:

$('#messages').append(document.createTextNode(item));

Ответ 2

Вы добавляете элемент, у которого уже есть контент? Или вы добавляете контент после добавления? В любом случае вам все равно нужно сделать .text(...) в этом элементе.

Если вы используете append и передаете HTML в качестве аргумента, попробуйте сначала создать элемент и передать его для добавления.

Пример:

$('<div/>').text('your content here').appendTo('div#someid')

Ответ 3

Если вы действительно хотите, чтобы jQuery удалил некоторый текст в фрагмент HTML и не захотел напрямую коснуться document, следующий чистый jQuery может избежать текста в HTML для вас (но только в контексте HTML):

jQuery('<p/>').text('v & M_FLAG == M_FLAG').html()

Это можно использовать для добавления текста довольно неэффективно:

jQuery('#message').append(jQuery('<p/>').text(item).html());

Элемент <p/> не будет вставлен, потому что .html() возвращает содержимое элемента в формате HTML, исключая элемент сам по себе.

На основе jQuerys нет встроенного способа создания экземпляров текстовых узлов, я думаю, авторы jQuerys ожидают, что пользователи будут напрямую использовать document.createTextNode(), как показано в предыдущем ответе .