2011-05-27 23 views
23

tengo un elemento como este:jQuery - establecer el texto de un único elemento sin eliminar otro elemento (ancla)

<td> 
    <a>anchor</a> 
    [ some text ] 
</td> 

y necesito establecer que es texto en jQuery, sin quitar el ancla.

El contenido del elemento puede variar en orden (texto anterior o posterior), y el texto real es desconocido.

Gracias

Nueva actualización

Esto es lo que me ocurrió usar, asume un único nodo de texto:

function setTextContents($elem, text) { 
     $elem.contents().filter(function() { 
      if (this.nodeType == Node.TEXT_NODE) { 
       this.nodeValue = text; 
      } 
     }); 
    } 

    setTextContents($('td'), "new text"); 
+2

¿Puede identificar si los contenidos serán antes o después del 'ancla 'en su javascript? Si es así, puede establecer una variable 'prepend()' o 'append()' en función de su caso. –

+0

Bastante complejo. ¿No hay posibilidad de incluir el texto en un lapso? – GolezTrol

+0

No estoy seguro de entender su pregunta, pero puede seleccionar la etiqueta de anclaje y utilizar .after() o .before() –

Respuesta

31

Neal's answer es mi sugerencia. jQuery no tiene una forma de seleccionar nodos de texto How do I select text nodes with jQuery?.

Cambiar la estructura de HTML creará el código más simple. Si no puede hacerlo, sólo puede utilizar la propiedad childNodes en busca de nodos de tipo 3 (TEXT_NODE) ​​

He aquí algunos ejemplos de código que asume el último nodo es el nodo que desea editar

http://jsfiddle.net/mendesjuan/B7rKs/

<div class='someClass'> 
    <a>anchor</a> 
    [ some text ] 
</div> 

<button id='btn'> Change text </button> 

$('#btn').click(function(){ 
    $('.someClass').get(0).lastChild.nodeValue = "New Value" 
}); 
+0

Muchas gracias por el enlace. –

+0

¡Oh, hombre esto es astuto! Me encanta :) – Nippysaurus

4

Si es posible poner el texto en un lapso :

<td id='someID'> 
    <a>anchor</a> 
    <span>[ some text ]</span> 
</td> 

Usted puede hacer:

$('td#someID span').text('new text') 
+1

Casi idéntico al que estaba publicando. –

+0

@ g.d.d.c ahhh pero no lo hizo :-P – Neal

+1

Lo hice, pero después agregué mi comentario al suyo.:) –

3

Sin cambiar marcado:

Live Demo

var anchor = $('td').find('a').clone(); 
$('td').text('{ some other text }').prepend(anchor); 
+0

Funciona, pero no es muy elegante. La etiqueta a se elimina innecesariamente y se vuelve a agregar al DOM. Esto es factible con un cambio mucho más pequeño en el DOM, ver mi respuesta –

Cuestiones relacionadas