Question

我有一个脚本，我想在用户可见的正文中的任意位置重新发布文字，如下所示：

$("body").html($("body").html().replace(/replaced word/g,'HELLO'));

这有效，但效果很好。每当“替换单词”在标记内，如href，span或div，或任何东西时，它会抛弃页面上的所有格式。在不影响页面功能的情况下，无论页面中包含哪些元素，都可以完成替换页面中每次出现的文本的最佳方法是什么？感谢

编辑：感谢talsibony和每个人的帮助，我得到了如何替换不影响html标签的子元素中的单词的答案。我希望用字体颜色或其他样式选项替换：

$(element).html($(element).selectorText().replace(/thisi/g,'<abbr title="hover title"><font color="#10a9cf">HELLO</font></abbr>'));

奇怪的是这段代码可以在jsfiddle中使用，但是当我在google Chrome扩展程序中包含此代码时，我正在处理页面加载页面为空。当我将其切换回selectortext时，它会加载，但我在替换中看到了html标签。

我无法理解为什么因为星际替换不起作用而且不会让页面加载！

$(element).html($(element).selectorText().replace(/thisi/g,'HELLO'));

在控制台中我收到以下错误：无法读取属性'replace'of null

我在这里缺少什么？再次感谢！

Answer 1

我认为你必须这样做的方式是单独在每个元素中并使用这个jquery小插件我在这里重写代码也是

fiddle

html

<div id="parent">
    thisi sthe fpcd
    <p>p</p>
</div>

插件，用于查找没有子元素的选择器文本的内容

$.fn.selectorText = function(text) {
    var str = '';

    this.contents().each(function() {
        if (this.nodeType === 3) {
            if(text){
                this.textContent = text;
                return false;
            }else{
                str += this.textContent || this.innerText || '';
            }

        }
    });

    return str;
};

将其用于您的案例

allowReplaceTags = ['DIV'];
$('body').find('*').each(function (i, element) {
    if ($.inArray(allowReplaceTags,element.tagName)){
        // do replace
        $(element).selectorText($(element).selectorText().replace(/thisi/g,'HELO'));

    }

});

Answer 2

$（＆＃34; body＆＃34;）。html（$（＆＃34; body＆＃34;）。text（）。replace（/ replace word / g，＆＃39; HELLO＆＃39;））;

Javascript替换标签中的文字而不更改子元素HTML和内容

2 个答案: