如何在JavaScript中使用“ a href”包装器搜索/替换文本？

Question

我已经将html转换为字符串，可以在该字符串中使用replace来用链接将文本换行，然后可以将该html放回其来源ID中。

我的问题是我的replace方法正在页面上的现有链接内 。 这可能会创建嵌套链接，这是一个问题。 有谁知道如何防止replace方法匹配链接中已经存在的文本？

我现在有：

keyword = "matching phrase";
keywordLink = "<a href='http://myurl.com'/>" + keyword + "</a>";
sasser = sasser.replace(keyword, keywordLink);
sasDom.innerHTML = sasser;

我在寻找伪代码：

... (keyword [if the next " < " sign is not followed by "/a>", regardless of how far away it is], keywordLink);

Answer 1

使用regex根本无法做这种事情。 处理文档对象，这些对象已经很好地解析为您的结构。

这是根据这个问题改编而成的关键字链接器。

// Find text in descendents of an element, in reverse document order
// pattern must be a regexp with global flag
//
function findTextExceptInLinks(element, pattern, callback) {
    for (var childi= element.childNodes.length; childi-->0;) {
        var child= element.childNodes[childi];
        if (child.nodeType===1) {
            if (child.tagName.toLowerCase()!=='a')
                findTextExceptInLinks(child, pattern, callback);
        } else if (child.nodeType===3) {
            var matches= [];
            var match;
            while (match= pattern.exec(child.data))
                matches.push(match);
            for (var i= matches.length; i-->0;)
                callback.call(window, child, matches[i]);
        }
    }
}

findTextExceptInLinks(document.body, /\bmatching phrase\b/g, function(node, match) {
    node.splitText(match.index+match[0].length);
    var a= document.createElement('a');
    a.href= 'http://www.example.com/myurl';
    a.appendChild(node.splitText(match.index));
    node.parentNode.insertBefore(a, node.nextSibling);
});

eta re注释：这是使用纯文本匹配而不是正则表达式的同一版本：

function findPlainTextExceptInLinks(element, substring, callback) {
    for (var childi= element.childNodes.length; childi-->0;) {
        var child= element.childNodes[childi];
        if (child.nodeType===1) {
            if (child.tagName.toLowerCase()!=='a')
                findPlainTextExceptInLinks(child, substring, callback);
        } else if (child.nodeType===3) {
            var index= child.data.length;
            while (true) {
                index= child.data.lastIndexOf(substring, index);
                if (index===-1)
                    break;
                callback.call(window, child, index)
            }
        }
    }
}

var substring= 'matching phrase';
findPlainTextExceptInLinks(document.body, substring, function(node, index) {
    node.splitText(index+substring.length);
    var a= document.createElement('a');
    a.href= 'http://www.example.com/myurl';
    a.appendChild(node.splitText(index));
    node.parentNode.insertBefore(a, node.nextSibling);
});

Answer 2

如果您不介意使用JQuery ，则可以使用其wrap()函数将文本或html元素包装在指定的标记中。

Answer 3

我将分三个步骤进行操作：

1）将<a [^>]+>matching phrase</a>替换$1some_other_phrase</a>

2）将matching phrase替换<a...>keyword</a>

3）用matching phrase替换some_other_phrase