调查结果及；使用好的Ole JavaScript替换Div中的单词

我知道这在jQuery中很容易做到，但我正在尝试用JavaScript实现

我有这个：

window.addEventListener('load', function() {

        function replaceName() {
        var oldText= "Mobile";
        var newText = "Stackoverflow";
        var oldString= document.getElementById('replace').innerHTML;
        var newString = oldString.replace(/oldText/g, newText);
        document.getElementById('replace').innerHTML = newString;
        }

        replaceName();

}, false);

不知道我做错了什么？有什么想法吗

谢谢

问题出在这里：

var newString = oldString.replace(/oldText/g, newText);

它实际上是在搜索

oldText

，而不是

“Mobile”

正如kb所说，您可以通过以下方式解决此问题：

var newString = oldString.replace(new RegExp(oldText, "g"), newText);

问题在于：

var newString = oldString.replace(/oldText/g, newText);

它实际上是在搜索

oldText

，而不是

“Mobile”

正如kb所说，您可以通过以下方式解决此问题：

var newString = oldString.replace(new RegExp(oldText, "g"), newText);

---

目前，您使用的是容易出错的方法

容易出错，因为您将丢失事件处理程序以及替换不希望替换的内容。如果搜索词是

'a'

，该怎么办？是否希望所有

a

元素都变成替换字符串

此外，您正在不必要地序列化来自DOM的HTML，当您再次设置它时，需要重新解析它

正确的方法是只迭代文本节点

var replaceText = function replaceText(element, search, replace) {
    var nodes = element.childNodes;

    for (var i = 0, length = nodes.length; i < length; i++) {

        var node = nodes[i];

        if (node.childNodes.length) {
            replaceText(node, search, replace);
            continue;
        }

        if (node.nodeType != 3) {
            continue;
        }

        node.data = node.data.replace(new RegExp(search, 'g'), replace);
    }

}

var replaceText=函数replaceText（元素、搜索、替换）{
var节点=element.childNodes；
对于（var i=0，length=nodes.length；i

---

.

目前，您使用的是容易出错的方法

容易出错，因为您将丢失事件处理程序以及替换不希望替换的内容。如果搜索词是

'a'

，该怎么办？是否希望所有

a

元素都变成替换字符串

此外，您正在不必要地序列化来自DOM的HTML，当您再次设置它时，需要重新解析它

正确的方法是只迭代文本节点

var replaceText = function replaceText(element, search, replace) {
    var nodes = element.childNodes;

    for (var i = 0, length = nodes.length; i < length; i++) {

        var node = nodes[i];

        if (node.childNodes.length) {
            replaceText(node, search, replace);
            continue;
        }

        if (node.nodeType != 3) {
            continue;
        }

        node.data = node.data.replace(new RegExp(search, 'g'), replace);
    }

}

var replaceText=函数replaceText（元素、搜索、替换）{
var节点=element.childNodes；
对于（var i=0，length=nodes.length；i

.

刚刚设置好

var oldText = /Mobile/g

刚定

var oldText = /Mobile/g

---

为了提供一个不使用

eval

（跟着我重复：不要使用

eval

！）的答案，请尝试以下行：

var newString = oldString.replace(new RegExp(oldText, "g"), newText);

---

以前您有

/pattern/flags

，现在您有了

新的RegExp（pattern，flags）

，为了提供一个不使用

eval

的答案（在我后面重复：不要使用

eval

！），请尝试这一行：

var newString = oldString.replace(new RegExp(oldText, "g"), newText);

---

---

以前您有

/pattern/flags

，现在您有了

新的RegExp（pattern，flags）

在定义正则表达式时，应该可以使用完整的语法而不是简短的形式，

var reg=new RegExp（oldText，“g”）

然后使用

oldString.replace（reg，newText）例如，我不建议在任何并非绝对必要的情况下使用
eval
。即使您认为这是绝对必要的，您也可能错了。在定义正则表达式时，应该可以使用完整语法而不是简短形式，
var reg=new RegExp（oldText，“g”）
然后使用
oldString.replace（reg，newText）例如，我不建议在任何并非绝对必要的情况下使用
eval
。即使你认为这是绝对必要的，你也可能错了。这是行不通的：P-它不再是正则表达式，而是一个普通的字符串。这就是我最初使用eval的原因。@Frits，谢谢，忘了去掉引号，因为它是一个regexp对象。新的RegExp（）方法更好。是的，整个想法当然是，
oldText
不同，它并不总是
Mobile
@Frits，是的，我会在我的任何应用程序中使其动态。这不起作用：P-它不再是一个regex，而是一个普通的字符串。这就是我最初使用eval的原因。@Frits，谢谢，忘了去掉引号，因为它是一个regexp对象。新的RegExp（）方法更好。是的，整个想法当然是，
oldText
不同，它并不总是
Mobile
@Frits，是的，我会在我的任何应用程序中使其动态化。要添加基准吗？事实上，我愿意（打个比方）打赌，使用innerHTML的这种方法并不像您预期的那样糟糕（根据浏览器/版本而有所不同）。因为您只有两个对DOM的调用。在textNodes上迭代可能会很麻烦。@Frits即使它比使用
innerHTML
慢，也可以避免损坏HTML或丢失与属性绑定的事件处理程序。它还可以避免标记中的匹配字符以及浏览器认为的innerHTML属性之间的差异。虽然性能可能较慢（但这并不能弥补innerHTML的所有缺点），但我同意。是否要添加一个基准测试？事实上，我愿意（打个比方）打赌，使用innerHTML的这种方法并不像您预期的那样糟糕（根据浏览器/版本而有所不同）。因为您只有两个对DOM的调用。在textNodes上迭代可能会很麻烦。@Frits即使它比使用
innerHTML
慢，也可以避免损坏HTML或丢失与属性绑定的事件处理程序。它还可以避免标记中的匹配字符以及浏览器认为的innerHTML属性之间的差异。同意虽然性能可能较慢（但这并不能弥补innerHTML的所有缺点）。