Trova tutte le istanze di "vecchio" in una pagina Web e sostituiscile con "nuovo", utilizzando un bookmarklet javascript

Question

Quello che voglio fare è sostituire tutte le istanze di "vecchio" in una pagina web con "nuovo" in un bookmarklet JS o uno script greasemonkey. Come posso fare questo? Suppongo che jQuery o altri framework siano a posto, poiché ci sono degli hack che li includono sia nei bookmarklet che negli script greasemonkey.

Answer 1

Ehi, potresti provare questo, il problema è che cerca l'intero corpo in modo che anche gli attributi e così vengano cambiati.

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

Answer 2

Una funzione che è a prova di clobber. Ciò significa che questo non toccherà alcun tag o attributo, solo testo. Versione

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:

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

Una linea semplice che funziona insieme jQuery:

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

Senza jQuery:

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

La funzione che restituisce nulla è molto importante, quindi il browser è non reindirizzato da nessuna parte dopo l'esecuzione del bookmarklet.

Answer 4

Se si sostituisce innerHtml, si eliminano tutti gli eventi dom presenti sulla pagina. Prova attraversando il documento per sostituire il testo:

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(); 

La split/join è più veloce di fare "sostituire" se non hai bisogno di pattern matching. Se avete bisogno di pattern matching quindi utilizzare "sostituire" e una regex:

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

Come un 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

Ancora un altro approccio ricorsivo:

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++; 
    } 
} 

minified 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

Ok, sono solo consolidando alcune delle grandi cose che le persone stanno mettendo in una sola risposta.

Ecco il codice jQuery di sixthgear, ma fatto portatili (fonte I jQuery dalla grande G) e minimizzato in un 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'); 

NOTA che 'vecchio' può essere una 'stringa letterale', o un 'reg [Ee] x'.

In realtà, ora che ci penso, sixthgear è la migliore risposta, specialmente con i miei miglioramenti. Non riesco a trovare nulla che le altre risposte aggiungano su di esso, utilizzando jQuery raggiunge l'incredibile compatibilità X-browser. Inoltre, sono semplicemente troppo dannatamente pigro. wiki della comunità, divertiti!

Answer 7

Sto provando a modificare leggermente questo in modo che richieda il testo da cercare, seguito dal testo da sostituire con, e al termine dell'elaborazione, mostra una finestra di dialogo che mi informa che è stata eseguita.

Ho intenzione di usarlo su una pagina di modifica del database phpmyadmin che avrà un numero qualsiasi di caselle di testo piene di testo (che è quello che mi serve per cercare e sostituire in). Inoltre, il testo da cercare e sostituire può essere o non essere multi-linea, quindi ho aggiunto il parametro 'm' nella regex, e anche, dato che farò ricerche/sostituzioni che potrebbero contenere html, spesso contengono citazioni/doppie virgolette. es:

Cerca:

<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> 

e magari sostituirlo con niente (solo per cancellare tutto ciò che il codice), o qualche altro html. Finora questo è il bookmarklet che ho trovato, (javascript, e in particolare i bookmarklet non sono qualcosa con cui incasino spesso) tuttavia, non fa nulla per quanto riguarda la ricerca/sostituzione, anche se lo fa correttamente.

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:','')); 

Qualcuno ha qualche idea?

Answer 8

Per i browser precedenti sarà necessario modificare Node.TEXT_NODE su 3 e il nodo.textContent su node.nodeValue; così la funzione finale dovrebbe leggere:

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]); 
     } 
    } 
}