Question

所以我知道window.find（）是一个在页面上找到字符串的非标准js对象，如果找到，它将返回true，否则返回false。现在有类似于string.replace（）的东西，但是是一个窗口对象（例如：window.replace（）），它将所有并发元素替换为其他东西（例如，将所有“ Hi”替换为“ Hello”）吗？

Answer 1

我不认为有，但是写起来比您想像的要容易。您只需遍历DOM寻找Text节点，然后在其replace上使用nodeValue：

function replaceAll(element, regex, replacement) {
    for (var child = element.firstChild;
         child;
         child = child.nextSibling) {
        if (child.nodeType === 3) { // Text
            child.nodeValue = child.nodeValue.replace(regex, replacement);
        } else if (child.nodeType === 1) { // Element
            replaceAll(child, regex, replacement);
        }
    }
}

我在那里使用了一个正则表达式（需要具有g标志）来获得执行替换时的“全局”行为，并具有灵活性。

实时示例：

function replaceAll(element, regex, replacement) {
    for (var child = element.firstChild;
         child;
         child = child.nextSibling) {
        if (child.nodeType === 3) { // Text
            child.nodeValue = child.nodeValue.replace(regex, replacement);
        } else if (child.nodeType === 1) { // Element
            replaceAll(child, regex, replacement);
        }
    }
}

setTimeout(function() {
    replaceAll(document.body, /one/g, "two");
}, 800);

<div>
  Here's one.
  <p>And here's one.</p>
  <p>And here's <strong>one</strong>
</div>

如果要使用简单的字符串而不是正则表达式，只需使用正则表达式转义函数（例如this question的答案中的函数，并按如下所示构建您的正则表达式：

var regex = new RegExp(yourEscapeFunction(simpleString), "g");

无法处理的情况是目标字符串穿过文本节点，如下所示：

<span>ex<span>ample</span></span>

使用上面的功能寻找"example"，您将找不到它。如果需要的话，我将其作为练习读者的一种练习...：-）

窗口对象中的string.find（）是否等效？

1 个答案: