Ganti kata-kata di teks tubuh

Apakah ada cara untuk mengganti teks normal dalam elemen tabel yang ditempatkan di dalam tubuh HTML?

Suka mengganti "halo" dengan "hai"?

Harap hanya gunakan JavaScript tanpa jQuery .

Untuk mengganti string di HTML Anda dengan yang lain, gunakan metode replace di innerHTML :

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

Perhatikan bahwa ini akan menggantikan contoh pertama di helloseluruh isi, termasuk semua contoh dalam kode HTML Anda (mis. Nama kelas dll ..), jadi gunakan dengan hati-hati - untuk hasil yang lebih baik, coba batasi ruang lingkup penggantian dengan menargetkan kode Anda menggunakan document.getElementById atau serupa.

Untuk mengganti semua contoh string target, gunakan ekspresi reguler sederhana dengan gbendera lobal:

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

Fungsi di bawah ini bekerja dengan sempurna untuk saya:

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

Berikut contoh penggunaan:

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

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

Anda juga dapat menggunakan melakukan penggantian langsung seperti:

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

Namun berhati-hatilah karena dapat memengaruhi tag, css, dan skrip juga.

EDIT: Adapun solusi JavaScript murni, gunakan metode ini sebagai gantinya:

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

Saya berakhir dengan fungsi ini untuk mengganti teks dengan aman tanpa efek samping (sejauh ini):

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

Ini untuk kasus di mana 16kB findAndReplaceDOMTextagak terlalu berat.

Saya memiliki masalah yang sama. Saya menulis fungsi saya sendiri menggunakan replace pada innerHTML, tetapi itu akan mengacaukan tautan jangkar dan semacamnya.

Untuk membuatnya bekerja dengan benar saya menggunakan perpustakaan untuk menyelesaikannya.

Perpustakaan memiliki API yang luar biasa. Setelah memasukkan script saya menyebutnya seperti ini:

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

Saya mencoba untuk mengganti string yang sangat besar dan untuk beberapa alasan ekspresi reguler memberikan beberapa kesalahan / pengecualian.

Jadi saya menemukan alternatif ekspresi reguler ini yang juga berjalan cukup cepat. Setidaknya itu cukup cepat bagi saya:

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

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

src: Bagaimana cara mengganti semua kemunculan string di JavaScript?

Gunakan fungsi ganti string javascript default

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

Cobalah untuk menerapkan solusi yang disarankan di atas pada dokumen yang cukup besar, mengganti string yang cukup pendek yang mungkin ada di innerHTML atau bahkan innerText, dan desain html Anda menjadi rusak paling baik

Oleh karena itu, pertama-tama saya hanya mengambil elemen simpul teks melalui simpul DOM HTML, seperti ini

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

ʻDan selanjutnya saya menerapkan penggantian pada semuanya dalam siklus

Ingin menambahkan contoh jawaban funky-future karena saya terus mendapatkan kesalahan ini:

Uncaught TypeError: element.childNodes is not iterable

gunakan seperti ini:

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

itu tidak berhasil untuk saya dengan pemilih jQuery.

Terkadang mengubah document.body.innerHTMLmerusak beberapa skrip JS di halaman. Ini versi, yang hanya mengubah konten textelemen:

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

Saya baru Javascriptdan baru mulai mempelajari keterampilan ini. Silakan periksa apakah metode di bawah ini berguna untuk mengganti teks.

<script>

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

</script>