2010-06-13 20 views

Respuesta

11

Eliminé el # de la ID, ya que no es un ID válido.

Dado que, intente esto:

Ejemplo vivo:http://jsfiddle.net/u49wy/

var $contents = $('#alvin').contents(); 

$contents[$contents.length - 1].nodeValue = 'orange'; 

.contents() devuelve todos los nodos secundarios del elemento, incluyendo los nodos de texto.

El código entonces agarra el último elemento de nodo (que es un nodo de texto) y actualiza su nodeValue, que es la forma de actualizar el valor de un nodo de texto.

+0

+1, me ganaste, aunque todavía publiqué mi solución porque difiere ligeramente :-) –

+0

@Andy - Gracias por el +. Sí, el mío opera con la suposición de un posicionamiento específico. Será un lanzamiento según las necesidades específicas de OP. – user113716

+0

Gracias! Sabía que se podría hacer. Ojalá pudiera otorgar múltiples soluciones como E * -E * .com (a Andy, también). –

6

Patrick me adelantó, pero mi solución es un poco más dinámica en la que sería seleccionar el texto en cualquier lugar, incluso si había etiquetas a cada lado:

$('#alvin').contents().filter(function() { 
    return this.nodeType == 3; 
})[0].nodeValue = "orange"; 

Lo hace filtrando el contenido para que solo queden nodos de texto y cambie el primer nodeValue a "naranja".

http://jsfiddle.net/ssRyB/

+0

¡Gracias! Ojalá pudiera otorgar múltiples soluciones como E * -E * .com. –

1

id="#alvin" no es una sintaxis válida, '#' se utiliza como parte de un selector de jQuery o en el CSS.

Para este ejemplo muy limitado, reemplace "apple" por "orange". De hecho, simplemente leería innerHTML y lo reescribiría. Ni siquiera estoy usando jQuery para esto.

window.onload = function() { 
    var alvin = document.getElementById('alvin') 
    alvin.innerHTML = alvin.innerHTML.replace('apple', 'orange'); 
} 

que se utiliza sin jQuery jQuery porque no tiene una forma limpia para seleccionar los nodos de texto callejeros. Entonces, ¿qué pasa si envolvemos los nodos de texto secundarios en tramos? Podríamos hacer esto:

$('#alvin').contents().filter(function() { 
    return this.nodeType == 3; 
}).wrap('<span></span>').end(); 

De esa manera, nos quedamos con la estructura:

<a id="alvin" href="http://www.camille.com"><ins class="xxx">Anna</ins><span>apple</span></a> 

entonces podemos utilizar el selector adyacente + para llegar a ella, como esto - ins+span significa una <span> después de una <ins>:

var elem = $('#alvin ins+span'); 
elem.text(elem.text().replace('apple', 'orange')); 
+0

No hay mucha jQuery allí ...;) –

+0

Sí, no estaba muy contento con mi respuesta tampoco. He agregado un segundo enfoque. – artlung

+0

Corregí la sintaxis; ¡Gracias! –

0

Otra forma (no muy bonita, aunque):

$("#alvin").html($("#alvin").html().replace(/apple$/,'orange')); 

Editar: Agregó $ al final de apple. Gracias Patrick.

+1

En realidad, no funcionará con la etiqueta de cierre 'a', ya que no forma parte del contenido de' # alvin'. El método '.html()' solo devolverá el contenido HTML interno. Ninguna parte del conjunto de etiquetas coincide con el selector. Sin embargo, podría usar un indicador de fin de entrada '$'. :) – user113716

Cuestiones relacionadas