Question

我正在尝试将包含一个或多个连字符“ - ”的文本中的所有单词都包含在一个span中，以便我可以添加一个no-linebreak css规则。不幸的是我不知道如何实现这一目标。任何想法/提示将不胜感激。谢谢！

示例：

    Before: <p>This product is ready-to-use.</p>
    After:  <p>This product is <span class="nbr">ready-to-use</span>.</p>

Answer 1

以下正则表达式可以解决问题：

((\w+-)+\w+)(?![^<]*\>)

((\w+-)+\w+)部分是一个正则表达式，它匹配用连字符分隔的单词。 (?!之后的部分确保表达式后面没有>，前面有<。这是为了避免在html标记内匹配由连字符分隔的单词（例如：<div class="style: margin-left">。您可能不希望与margin-left匹配。

为了在javascript中使用正则表达式，你必须使用原始字符串，并在正则表达式周围添加括号以将匹配的值作为一组捕获：

text.replace(/(((\w+-)+\w+)(?![^<]*\>))/m, '<span class="nbr">$1</span>');

Answer 2

前段时间我写了一篇lib。它适用于DOM文本节点，因此它避免使用RegEx解析HTML（这是不可能的）。

https://github.com/prinzhorn/linguigi

实施例

var ling = new Linguigi();

ling.eachToken(/[\w-]+/, true, function(token) {
    return '<span class="nbr">' + token + '</span>';
});

您可能希望更好地使用符合您需求的正则表达式。

Answer 3

    String text = "<p>This product is ready-to-use.</p>";
    text = text.replaceAll("(\\w+-(\\w+-?)+)", "<span class=\"nbr\">$1</span>");
    System.out.println(text);

jQuery / javascript：查找字符并包含包含它的单词

3 个答案: