Sostituisci le parole nel corpo del testo

C'è un modo per sostituire il testo normale all'interno di un elemento di tabella che è posizionato all'interno del corpo dell'HTML?

Come sostituire "ciao" con "ciao"?

Utilizzare solo JavaScript senza jQuery .

Per sostituire una stringa nel tuo HTML con un'altra usa il metodo replace su innerHTML :

document.body.innerHTML = document.body.innerHTML.replace('hello', 'hi');

Tieni presente che questo sostituirà la prima istanza di in hellotutto il corpo, comprese tutte le istanze nel codice HTML (ad es. Nomi di classi ecc.), Quindi usala con cautela: per risultati migliori, prova a limitare l'ambito della sostituzione scegliendo come target il codice utilizzando document.getElementById o simile.

Per sostituire tutte le istanze della stringa di destinazione, utilizzare una semplice espressione regolare con il gflag lobal:

document.body.innerHTML = document.body.innerHTML.replace(/hello/g, 'hi');

La funzione seguente funziona perfettamente per me:

// Note this *is* JQuery, see below for JS solution instead
function replaceText(selector, text, newText, flags) {
  var matcher = new RegExp(text, flags);
  $(selector).each(function () {
    var $this = $(this);
    if (!$this.children().length)
       $this.text($this.text().replace(matcher, newText));
  });
}

Ecco un esempio di utilizzo:

function replaceAllText() {
  replaceText('*', 'hello', 'hi', 'g');
}

$(document).ready(replaceAllText);
$('html').ajaxStop(replaceAllText);

Puoi anche usare fai una sostituzione diretta in questo modo:

document.body.innerHTML = document.body.innerHTML.replace('hello', 'hi');

Ma fai attenzione poiché potrebbe influire anche su tag, css e script.

EDIT: come per una soluzione JavaScript pura, usa invece questo metodo:

function replaceText(selector, text, newText, flags) {
  var matcher = new RegExp(text, flags);
  var elems = document.querySelectorAll(selector), i;

  for (i = 0; i < elems.length; i++)
    if (!elems[i].childNodes.length)
      elems[i].innerHTML = elems[i].innerHTML.replace(matcher, newText);
}

Ho finito con questa funzione per sostituire in modo sicuro il testo senza effetti collaterali (finora):

function replaceInText(element, pattern, replacement) {
    for (let node of element.childNodes) {
        switch (node.nodeType) {
            case Node.ELEMENT_NODE:
                replaceInText(node, pattern, replacement);
                break;
            case Node.TEXT_NODE:
                node.textContent = node.textContent.replace(pattern, replacement);
                break;
            case Node.DOCUMENT_NODE:
                replaceInText(node, pattern, replacement);
        }
    }
}

È per i casi in cui i 16kB findAndReplaceDOMTextsono un po 'troppo pesanti.

Ho avuto lo stesso problema. Ho scritto la mia funzione usando la sostituzione su innerHTML, ma rovinerebbe i collegamenti di ancoraggio e simili.

Per farlo funzionare correttamente ho usato una libreria per farlo.

La libreria ha un'API fantastica. Dopo aver incluso lo script l'ho chiamato così:

findAndReplaceDOMText(document.body, {
  find: 'texttofind',
  replace: 'texttoreplace'
  }
);

Stavo cercando di sostituire una stringa molto grande e per qualche motivo le espressioni regolari lanciavano alcuni errori / eccezioni.

Quindi ho trovato questa alternativa alle espressioni regolari che funziona anche abbastanza velocemente. Almeno è stato abbastanza veloce per me:

var search = "search string";
var replacement = "replacement string";

document.body.innerHTML = document.body.innerHTML.split(search).join(replacement)

src: come sostituire tutte le occorrenze di una stringa in JavaScript?

Utilizza la funzione di sostituzione della stringa javascript predefinita

var curInnerHTML = document.body.innerHTML;
curInnerHTML = curInnerHTML.replace("hello", "hi");
document.body.innerHTML = curInnerHTML;

Prova ad applicare la soluzione suggerita sopra su un documento abbastanza grande, sostituendo stringhe piuttosto corte che potrebbero essere presenti in innerHTML o anche innerText, e il tuo design html si rompe nel migliore dei casi

Pertanto, per prima cosa prendo solo gli elementi del nodo di testo tramite nodi HTML DOM, come questo

function textNodesUnder(node){
  var all = [];
  for (node=node.firstChild;node;node=node.nextSibling){
    if (node.nodeType==3) all.push(node);
    else all = all.concat(textNodesUnder(node));
  }
  return all;
}

textNodes=textNodesUnder(document.body)
for (i in textNodes) { textNodes[i].nodeValue = textNodes[i].nodeValue.replace(/hello/g, 'hi');    

'e successivamente ho applicato la sostituzione su tutti loro in ciclo

Volevo aggiungere un esempio alla risposta di funky-future mentre continuavo a ricevere questo errore:

Uncaught TypeError: element.childNodes is not iterable

usa in questo modo:

replaceInText(document.body,"search term","replacement");

non ha funzionato per me con i selettori jQuery.

A volte la modifica document.body.innerHTMLinterrompe alcuni script JS sulla pagina. Ecco la versione, che cambia solo il contenuto degli textelementi:

function replace(element, from, to) {
    if (element.childNodes.length) {
        element.childNodes.forEach(child => replace(child, from, to));
    } else {
        const cont = element.textContent;
        if (cont) element.textContent = cont.replace(from, to);
    }
};

replace(document.body, new RegExp("hello", "g"), "hi");

Sono nuovo Javascripte ho appena iniziato ad apprendere queste abilità. Si prega di verificare se il metodo seguente è utile per sostituire il testo.

<script>

    var txt=document.getElementById("demo").innerHTML;
    var pos = txt.replace(/Hello/g, "hi")
    document.getElementById("demo").innerHTML = pos;

</script>