Cómo anexar/anteponer/crear un nodo de texto con jQuery

Question

Duplicar posibles:
Escaping text with jQuery append?

Mi HTML es algo como esto:

<div id="selector">Hello World</div> 

Ahora estoy Me gusta agregar texto a este div. Sé que yo podría simplemente utilizar

$('#selector').append(text); 

pero esto no escaparía ningún carácter especial en text. Otra forma es ajustar el texto en un lapso:

$('#selector').append($('<span>').text(text)); 

Pero esto es feo, porque crea un marcado innecesario. Así que mi solución actual es crear manualmente un textNode:

$('#selector').append(document.createTextNode(text)); 

Me preguntaba si existe alguna de estilo jQuery manera de hacer esto?

Answer 1

El enfoque createTextNode es probablemente el mejor camino a seguir. Si quieres tener una sintaxis jQuery-ish, puedes hacer un plugin.

$.fn.appendText = function(text) { 
    return this.each(function() { 
     var textNode = document.createTextNode(text); 
     $(this).append(textNode); 
    }); 
}; 

Answer 2

Puede usar;

$.extend({ 
     urlEncode: function(value) { 
      var encodedValue = encodeURIComponent(value); 
      encodedValue = encodedValue.replace("+", "%2B"); 
      encodedValue = encodedValue.replace("/", "%2F"); 

      return encodedValue; 
     }, 
     urlDecode: function(value) { 
      var decodedValue = decodeURIComponent(value); 
      decodedValue = decodedValue.replace("%2B", "+"); 
      decodedValue = decodedValue.replace("%2F", "/"); 

      return decodedValue; 
     } 
}); 

para escapar de los caracteres HTML antes de anexar al DOM.

Utilícelo como; $.urlEncode(value)

Utilizándolo; $('#selector').append($.urlEncode(text));

Actualización # 1

Usted podría este $('#selector').html($('#selector').html() + text);

Yo sospechaba que esto era lo que quería.

Answer 3

$.text() acepta también una función como parámetro. Esta función recibirá un índice y el texto actual. El valor de retorno de la función se establecerá como el nuevo texto.

http://jsfiddle.net/4SvgV/1/