Finden Sie alle Instanzen von "alt" auf einer Webseite und ersetzen Sie jedes durch ein neues Lesezeichen mit einem JavaScript Bookmarklet

Question

Ich möchte alle Instanzen von "alt" auf einer Webseite mit "neu" in einem JS Bookmarklet ersetzen ein Grainemonkey-Skript. Wie kann ich das machen? Ich nehme an, dass jQuery oder andere Frameworks in Ordnung sind, da es Hacks gibt, die sowohl in Bookmarklets als auch in Graemon-Key-Skripten enthalten sind.

Answer 1

Hey, du könntest das versuchen, Problem ist es sucht den gesamten Körper, so dass sogar Attribute und solche geändert werden.

javascript:document.body.innerHTML=document.body.innerHTML.replace(/old/g, "new"); 

Answer 2

Eine Funktion, die clobbersicher ist. Das bedeutet, dass dies keine Tags oder Attribute berührt, nur Text.

function htmlreplace(a, b, element) {  
    if (!element) element = document.body;  
    var nodes = element.childNodes; 
    for (var n=0; n<nodes.length; n++) { 
     if (nodes[n].nodeType == Node.TEXT_NODE) { 
      var r = new RegExp(a, 'gi'); 
      nodes[n].textContent = nodes[n].textContent.replace(r, b); 
     } else { 
      htmlreplace(a, b, nodes[n]); 
     } 
    } 
} 

htmlreplace('a', 'r'); 

Bookmarklet Version:

javascript:function htmlreplace(a,b,element){if(!element)element=document.body;var nodes=element.childNodes;for(var n=0;n<nodes.length;n++){if(nodes[n].nodeType==Node.TEXT_NODE){nodes[n].textContent=nodes[n].textContent.replace(new RegExp(a,'gi'),b);}else{htmlreplace(a,b,nodes[n]);}}}htmlreplace('old','new'); 

Answer 3

Eine einfache Linie, die entlang jQuery funktioniert:

`javascript:var a = function(){$("body").html($("body").html().replace(/old/g,'new'));return;}; a();` 

Ohne jQuery:

`javascript:function a(){document.body.innerHTML=document.body.innerHTML.replace(/old/g, "new");return;}; a();` 

Die Funktion Rückkehr nichts ist sehr wichtig, so ist der Browser nach dem Ausführen des Bookmarklets nicht umgeleitet.

Answer 4

Wenn Sie den innerHtml ersetzen, zerstören Sie alle Dom-Ereignisse, die Sie auf der Seite haben. Versuchen Sie das Dokument durchqueren Text ersetzt werden:

function newTheOlds(node) { 
    node = node || document.body; 
    if(node.nodeType == 3) { 
     // Text node 
     node.nodeValue = node.nodeValue.split('old').join('new'); 
    } else { 
     var nodes = node.childNodes; 
     if(nodes) { 
      var i = nodes.length; 
      while(i--) newTheOlds(nodes[i]); 
     } 
    } 
} 

newTheOlds(); 

Der Split/join ist schneller als zu tun „ersetzen“, wenn Sie keine Musteranpassung benötigen. Wenn Sie Pattern-Matching dann verwenden "ersetzen" und ein regulären Ausdruck:

node.nodeValue = node.nodeValue.replace(/(?:dog|cat)(s?)/, 'buffalo$1'); 

Als Bookmarklet:

javascript:function newTheOlds(node){node=node||document.body;if(node.nodeType==3){node.nodeValue=node.nodeValue.split('old').join('new');}else{var nodes=node.childNodes;if(nodes){var i=nodes.length;while(i--)newTheOlds(nodes[i]);}}}newTheOlds(); 

Answer 5

Noch einen rekursiven Ansatz:

function replaceText(oldText, newText, node){ 
    node = node || document.body; 

    var childs = node.childNodes, i = 0; 

    while(node = childs[i]){ 
    if (node.nodeType == Node.TEXT_NODE){ 
     node.textContent = node.textContent.replace(oldText, newText); 
    } else { 
     replaceText(oldText, newText, node); 
    } 
    i++; 
    } 
} 

minimiert Bookmarklet:

javascript:function replaceText(ot,nt,n){n=n||document.body;var cs=n.childNodes,i=0;while(n=cs[i]){if(n.nodeType==Node.TEXT_NODE){n.textContent=n.textContent.replace(ot,nt);}else{replaceText(ot,nt,n);};i++;}};replaceText('old','new'); 

Answer 6

Okay, ich bin nur einige der großartigen Sachen konsolidieren, die Leute in einer Antwort aufstellen. Hier

ist sixthgear jQuery-Code, aber gemacht portable (I Quelle jQuery aus dem großen G) und minimierte in ein Bookmarklet:

javascript:var scrEl=document.createElement('script');scrEl.setAttribute('language','javascript');scrEl.setAttribute('type','text/javascript');scrEl.setAttribute('src','http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js');function htmlreplace(a,b,element){if(!element)element=document.body;var nodes=$(element).contents().each(function(){if(this.nodeType==Node.TEXT_NODE){var r=new RegExp(a,'gi');this.textContent=this.textContent.replace(r,b);}else{htmlreplace(a,b,this);}});}htmlreplace('old','new'); 

Hinweis, dass 'alte' kann entweder eine 'Stringliteral', oder ein 'reg [Ee] x'.

Eigentlich, jetzt, wo ich darüber nachdenke, ist sixthgear's die beste Antwort, besonders mit meinen Verbesserungen. Ich kann nichts finden, was die anderen Antworten hinzufügen, jQuery erreicht unglaubliche X-Browser-Kompatibilität. Außerdem bin ich einfach zu faul. Community-Wiki, Viel Spaß!

Answer 7

Ich versuche, dies leicht zu ändern, so dass es nach dem zu suchenden Text fragt, gefolgt von dem zu ersetzenden Text, und wenn die Verarbeitung abgeschlossen ist, wird ein Dialogfeld angezeigt, das mich informiert.

Ich plane, es auf einer phpmyadmin Datenbank bearbeiten Seite verwenden, die eine beliebige Anzahl von Textfeldern mit Text gefüllt haben (was ist es, was ich suchen und ersetzen in). Der zu suchende und zu ersetzende Text kann auch nicht mehrzeilig sein, also habe ich den 'm' Parameter in der Regex hinzugefügt, und auch, da ich Suchen/Ersetzen durchführen werde, die HTML enthalten können, sie Ich habe oft Zitate/Anführungszeichen in ihnen. ex:

Suchen nach:

<img height="76" width="92" src="http://www.gifs.net/Animation11/Hobbies_and_Entertainment/Games_and_Gambling/Slot_machine.gif" /></div> 
<div class="rtecenter"> <strong><em><font color="#ff0000">Vegas Baby!<br /> 
</font></em></strong></div> 

und vielleicht mit nichts ersetzen oder einem anderen HTML (nur all diesem Code löschen). Bis jetzt ist dies das Bookmarklet, das ich mir ausgedacht habe, (Javascript, und vor allem Bookmarklets sind nicht etwas, mit dem ich mich oft ärgere) aber es tut nichts so weit wie das Suchen/Ersetzen, obwohl es die Aufforderung richtig macht.

javascript:var%20scrEl=document.createElement('script');scrEl.setAttribute('language','javascript');scrEl.setAttribute('type','text/javascript');scrEl.setAttribute('src','http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js');function%20htmlreplace(a,b,element){if(!element)element=document.body;var%20nodes=$(element).contents().each(function(){if(this.nodeType==Node.TEXT_NODE){var%20r=new%20RegExp(a,'gim');this.textContent=this.textContent.replace(r,b);}else{htmlreplace(a,b,this);alert('Done%20processing.');}});}htmlreplace(prompt('Text%20to%20find:',''),prompt('Replace%20with:','')); 

Wer hat irgendwelche Ideen?

Answer 8

Für ältere Browser müssen Node.TEXT_NODE auf 3 und der node.textContent auf node.nodeValue; so sollte letzte Funktion lesen:

function htmlreplace(a, b, element) {  
    if (!element) element = document.body;  
    var nodes = element.childNodes; 
    for (var n=0; n<nodes.length; n++) { 
     if (nodes[n].nodeType == 3) { //Node.TEXT_NODE == 3 
      var r = new RegExp(a, 'gi'); 
      nodes[n].nodeValue = nodes[n].nodeValue.replace(r, b); 
     } else { 
      htmlreplace(a, b, nodes[n]); 
     } 
    } 
}