Question

我试图创建一个简单的扩展名，用其他人替换某些单词。我使用regexp查找全局匹配，然后使用条件替换单词。但是，它只替换了每个单词的第一次出现，尽管我指定了＆＃34; gi＆＃34;。谁能解释为什么它表现出这种行为？

我从这里得到了一些代码：Javascript Regex to replace text NOT in html attributes

代码如下：

// Reusable generic function
function surroundInElement(el, regex, surrounderCreateFunc) {
    // script and style elements are left alone
    if (!/^(script|style)$/.test(el.tagName)) {
        var child = el.lastChild;
        while (child) {
            if (child.nodeType == 1) {
                surroundInElement(child, regex, surrounderCreateFunc);
            } else if (child.nodeType == 3) {
                surroundMatchingText(child, regex, surrounderCreateFunc);
            }
            child = child.previousSibling;
        }
    }
}

// Reusable generic function
function surroundMatchingText(textNode, regex, surrounderCreateFunc) {
    var parent = textNode.parentNode;
    var result, surroundingNode, matchedTextNode, matchLength, matchedText;
    while ( textNode && (result = regex.exec(textNode.data)) ) {
        matchedTextNode = textNode.splitText(result.index);
        matchedText = result[0];
        matchLength = matchedText.length;
        textNode = (matchedTextNode.length > matchLength) ?
            matchedTextNode.splitText(matchLength) : null;
        surroundingNode = surrounderCreateFunc(matchedTextNode.cloneNode(true));
        parent.insertBefore(surroundingNode, matchedTextNode);
        parent.removeChild(matchedTextNode);
    }
}

// This function does the surrounding for every matched piece of text
// and can be customized  to do what you like
function createSpan(matchedTextNode) {
    var val = matchedTextNode.nodeValue;
    var valuelower = val.toLowerCase();
    if(valuelower === "nice" || valuelower === "good" || valuelower === "great" || valuelower === "awesome" || valuelower === "amazing"){
        var t = document.createTextNode("gj");
        var el = document.createElement("span");
        el.style.color = "red";
        el.appendChild(t);
        return el;
    }

    if(valuelower === "bad" || valuelower === "terrible" || valuelower === "horrendous" || valuelower === "awful" || valuelower === "abominable"){
        var t = document.createTextNode("bj");
        var el = document.createElement("span");
        el.style.color = "red";
        el.appendChild(t);
        return el;
    }

    if(valuelower === "does"){
        var t = document.createTextNode("dose");
        var el = document.createElement("span");
        el.style.color = "red";
        el.appendChild(t);
        return el;
    }
}

// The main function
function wrapWords(container, words) {
    // Replace the words one at a time.
    for (var i = 0, len = words.length; i < len; ++i) {
        surroundInElement(container, new RegExp(words[i], "gi"), createSpan);
    }
}

wrapWords(document.body, ["nice", "good", "great", "awesome", "amazing", "bad", "terrible", "horrendous", "awful", "abominable", "does"]);

Answer 1

这是因为regex.exec方法返回＆＃39; next＆＃39;匹配，从最后一场比赛结束开始。您正在做的是为您创建的每个RegExp对象获取第一个匹配项，然后进行替换，然后转到下一个RegExp对象。

您需要的是再次运行正则表达式，但是为每个RegExp对象启动匹配最后一个节点结束的位置。使用您当前的代码，它很简单，只需重新启动即可。＆＃39;开关。

JavaScript Global Regex不是全球性的

1 个答案: