JQuery: Wie ersetzen Sie Text NACH einem verschachtelten Tag?

Question

Ich versuche, die jQuery-Anweisung, um herauszufinden, „Apfel“ mit umbenennen „orange:“

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

kann dies leicht getan werden?

Answer 1

Ich entfernte die von der ID, da es kein gültiges ID-Zeichen ist.

Da, versuchen Sie dies:

anschauliches Beispiel:http://jsfiddle.net/u49wy/

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

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

.contents() kehrt die alle untergeordneten Knoten des Elements, einschließlich Textknoten.

Der Code greift dann das letzte Element Knoten (der ein Textknoten ist) und aktualisiert seine nodeValue, wie Sie den Wert eines Textknotens aktualisieren.

• .contents() - http://api.jquery.com/contents

Answer 2

patrick schlagen mich, aber meine Lösung ist ein wenig mehr Dynamik, dass sie den Text überall wählen würde, auch wenn es Tags auf beiden Seiten waren:

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

Dies geschieht durch Filtern des Inhalts, so dass nur Textknoten bleiben, und ändert die erste nodeValue in "orange".

http://jsfiddle.net/ssRyB/

Answer 3

id="#alvin" ist nicht gültig Syntax, '#' wird als Teil eines Wählers für jQuery oder in CSS verwendet.

Für dieses sehr begrenzte Beispiel, ersetzen "Apple" durch "Orange" Ich würde eigentlich einfach lesen innerHTML und neu schreiben. Ich benutze nicht einmal jQuery dafür.

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

habe ich keine jQuery, weil jQuery Streutextknoten wählen nicht eine saubere Art und Weise müssen. Was passiert also, wenn wir alle untergeordneten Textknoten in Spannen einschließen? Wir könnten dies tun:

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

Auf diese Weise sind wir mit der Struktur links:

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

Dann können wir den + benachbarten Selektor verwenden, um es zu bekommen, wie diese - ins+span bedeutet ein <span> nach einem <ins>:

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

Answer 4

eine andere Möglichkeit (nicht sehr schön aber):

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

Bearbeiten: Hinzugefügt die $ am Ende von Apple. Danke Patrick.