2014-02-16 5 views
5

Ich möchte ein bestimmtes Wort in meinem Code ohne Auswirkungen auf HTML-URLs und Attribute zu ersetzen. Ich habe versucht, jedes p-Tag zu ersetzen, aber es gibt einige Inhalte in div-Tags, die ebenfalls ersetzt werden müssen.Ersetzen Sie einen Text in HTML-Tag ohne Auswirkungen auf Tags Attribute und Links

$("p:not(:has(img))").each(function(){ 
    var b = $(this).html().replace(/oldtext/g, "newtext"); 
    $(this).html(b); 
}); 
+0

uns zeigen, was haben Sie versucht? –

+0

Sie müssen Textknoten verwenden. – SLaks

+0

Sorry @SLaks Ich bin Anfänger in Jquery was meinst du von Textknoten –

Antwort

2

Ich schrieb einen Vanille-JavaScript-Funktion für Sie, es ändert sich nichts anderes als die oldtext zum newtext:

replaceAllTextWith = function (jq, oldtxt, newtxt) { 
    for (var j = 0; j < jq.length; j++) { 
     var el = jq[j]; 
     for (var i = 0; i < el.childNodes.length; i++) { 
      var cnode = el.childNodes[i]; 
      if (cnode.nodeType == 3) { 
       console.log(el.tagName); 
       var nval = cnode.nodeValue; 
       //add .toLowerCase() here if you want to consider capital letters 
       if (-1 < nval.indexOf(oldtxt)) { 
        cnode.nodeValue = nval.replace(new RegExp(oldtxt, "g"), newtxt); 
       } 
      } else if (cnode.nodeType == 1) { 
       replaceAllTextWith([cnode], oldtxt, newtxt); 
      } 
     } 
    } 
}; 

Sie können es nennen mag:

replaceAllTextWith($("p:not(:has(img))"), "oldtext", "newtext") 
+0

Dies kann _destructive_ die HTML-Struktur ändern. – undefined

+0

Während die contains ist schön, wird es nicht berücksichtigen, wenn etwas groß geschrieben wird. Die Verwendung von text() kann auch mehrere Teile des html zerstören, indem die html-Tags verschachtelter Elemente entfernt werden. – Jesse

+0

@undefined: was, wenn es nur auf Textknoten gefiltert wird. –

0

dieses ist eine interessante Aufgabe als Jquery html() zeigt nur die HTML innerhalb des Selektors, aber nicht die HTML eines verschachtelten Elements

die lösung besteht darin, den html-code zeilenweise aufzuspalten (block) und zu prüfen, ob ein bestimmtes element (img) vorhanden ist oder nicht, um die ersetzung durchzuführen.

dies ist der html:

<div id="a_unique_wrap_id"> 
<p><img src="https://www.google.pt/images/srpr/logo11w.png" /><h1>abc</h1></p> 
<p><img src="https://www.google.pt/images/srpr/logo11w.png" />def</p> 
<p><h1><span><b>abc</b></span></h1></p> 
<div><h1><span><b>abc</b></span></h1></div> 
<div><h1><span><b>def</b></span></h1></div> 
</div> 

und das ist das javascript:

selector=$('div'); 
exclude='<img'; 

str=(selector.html().split('\n')); 
l=str.length; 
output=''; 
for(x=0;x<l;x++){ 
    if(str[x].indexOf(exclude)>=0){ 
     output+=str[x];  
    }else output+=str[x].replace(/abc/g, "newtext"); 
} 
$('#a_unique_wrap_id').html(output); 

ein funktionierendes Beispiel ist hier: http://jsfiddle.net/hbrunar/w6BfL/6/

Verwandte Themen