Question

我在网站上有几个帖子;所有这些帖子都是这种类型的聊天对话：

AD：嘿！
BC：怎么了？
AD：没什么事 BC：好的

它们被标记为<p>标记所包围的简单段落。

使用javascript替换功能，我希望在对话开始时所有“AD”实例（即，行开头的“AD”的所有实例后跟“：”）被{包围{1}}标记，但仅当实例尚未被<strong>标记包围时才会生效。

我应该使用什么正则表达式来实现这一目标？我是否正在尝试this提出建议？

我正在使用的代码是这样的：

<strong>

Answer 1

将找到的段落的类或样式属性设置为text-weight：bold或大致相同的类不是更容易吗？这样您就不必担心添加标签或搜索现有标签。如果你不需要做任何字符串替换，也可能表现得更好。

如果你真的想要添加强标签，我建议使用DOM函数来查找段落中＆lt; strong＆gt;的childNodes，如果找不到，添加它并移动原始（ text）段落的childNode进入它。

Answer 2

如果AD:始终位于一行的开头，则使用m开关可以使用以下正则表达式：

.replace(/^AD:/gm, "<strong>AD:</strong>");

您不需要检查是否存在<strong>，因为^将匹配行的开头，而正则表达式只会匹配行开头后面的字符序列是AD:。

你不会反对“不要使用正则表达式解析HTML”的建议，因为你没有解析HTML，你只是用另一个字符串替换字符串。

正则表达式的替代方法是使用ranges，创建一个范围选择文本，然后使用execCommand使文本变为粗体。但是，我认为这将更加困难，您可能会面临浏览器实施方面的差异。正则表达方式应该足够了。

<小时/> 看到你的评论后，以下正则表达式可以正常工作：

.replace(/<(p|br)>AD:/gm, "<$1><strong>AD:</strong>");

Answer 3

在innerHTML上使用正则表达式不可靠，可能会导致问题。正确的做法是一个令人厌烦的过程，但更可靠。

E.g。

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

    findAndReplaceInDOM(posts[i], /^AD:/g, function(match, node){

        // Make sure current node does note have a <strong> as a parent
        if (node.parentNode.nodeName.toLowerCase() === 'strong') {
            return false;
        }

        // Create and return new <strong>
        var s = document.createElement('strong');
        s.appendChild(document.createTextNode(match[0]));
        return s;

    });

}

findAndReplaceInDOM函数：

function findAndReplaceInDOM(node, regex, replaceFn) {

    // Note: regex MUST have global flag
    if (!regex || !regex.global || typeof replaceFn !== 'function') {
        return;
    }

    var start, end, match, parent, leftNode,
        rightNode, replacementNode, text,
        d = document;

    // Loop through all childNodes of "node"
    if (node = node && node.firstChild) do {

        if (node.nodeType === 1) {

            // Regular element, recurse:
            findAndReplaceInDOM(node, regex, replaceFn);

        } else if (node.nodeType === 3) {

            // Text node, introspect

            parent = node.parentNode;
            text = node.data;

            regex.lastIndex = 0;

            while (match = regex.exec(text)) {

                replacementNode = replaceFn(match, node);

                if (!replacementNode) {
                    continue;
                }

                end = regex.lastIndex;
                start = end - match[0].length;

                // Effectively split node up into three parts:
                // leftSideOfReplacement + REPLACEMENT + rightSideOfReplacement

                leftNode = d.createTextNode( text.substring(0, start) );
                rightNode = d.createTextNode( text.substring(end) );

                parent.insertBefore(leftNode, node);
                parent.insertBefore(replacementNode, node);
                parent.insertBefore(rightNode, node);

                // Remove original node from document
                parent.removeChild(node);

            }

        }
    } while (node = node.nextSibling);

}

仅当<strong>标记不存在时，帮助编写将使用<strong>标记包围某些文本的正则表达式</strong> </strong>

3 个答案: