JS只替换没有html标签和代码的文本 [英] JS replace only text without html tags and codes

问题描述

我想在不改变任何html标签或js代码的情况下替换文档中的一些词.

I want to replace some words of the document without changing any html tags or js codes.

基本上我所做的是；

document.body.innerHTML = document.body.innerHTML.replace('lorem','new lorem');

但是此代码将替换任何lorem".我想避免像这样的标签； 等

But this code will replace any 'lorem'. I want to avoid tags like; <script... var lorem = 123; <div class="lorem", <a id="lorem" etc.

如何在 JS 中执行此操作?

How can I do this in JS?

推荐答案

遍历 DOM，以及 .replace() 文本节点的值.

Walk the DOM, and .replace() the values of text nodes.

function walk(el, fn) {
    for (var i = 0, len = el.childNodes.length; i < len; i++) {
        var node = el.childNodes[i];
        if (node.nodeType === 3)
            fn(node);
        else if (node.nodeType === 1 && node.nodeName !== "SCRIPT")
            walk(node, fn);
    }
}

<小时>

walk(document.body, function(node) {
    var text = node.data.split("foo"),
        parent = node.parentNode,
        i = 1,
        newNode;

    parent.insertBefore(textNode(text[0]), node);

    for (; i < text.length; i += 2) {
        (newNode = document.createElement("b"))
                           .appendChild(textNode("bar"));
        parent.insertBefore(newNode, node);
        parent.insertBefore(textNode(text[i]), node);
    }
    parent.removeChild(node);
});

function textNode(txt) {
    return document.createTextNode(txt);
}

这篇关于JS只替换没有html标签和代码的文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！