Question

我正在尝试用“＆lt; pre＆gt;＆lt; / pre＆gt;”替换所有系列的“字符”在Javascript中使用正则表达式。

所以我想把下面的第一行改为第二行：

<p>There   should    be    gaps    of    4    chars    tween    each    word</p>
<p>There<pre>   </pre>should<pre>    </pre>be<pre>    </pre>gaps<pre>    </pre>of<pre>    </pre>4<pre>    </pre>chars<pre>    </pre>tween<pre>    </pre>each<pre>    </pre>word</p>

// Or if I cannot place <pre>'s inside a <p> element then replace them with 
// transparent "_" chars
<p>There<font style="color: transparent">____</font>should...</p>

我这样做的原因是因为我试图保留/显示空间字符，如果我将整个段落放在pre元素中，那么自动换行将被禁用。

你能帮助我使用正则表达式在每组“”字符的末尾放置一个开始和结束标记吗？

var p = document.getElementById("myP");
var con = p.innerHTML;
con = con.replace(new RegExp("[ ]{2,}"), "<pre> ");
con = con.replace(new RegExp("[ ]{2,}"), " </pre>");
p.innerHTML = con;

// This is incorrect because it removes all the space chars and only leaves one there
// Test    string
// Test<pre> </pre>string // there should be 4 space chars here

Answer 1

使用(和)捕获匹配项，然后使用$1

引用该匹配项

var p = document.getElementById("myP");
var con = p.innerHTML;
con = con.replace(/(\s{2,})/g, "<pre>$1</pre>");

Answer 2

不是在段落中间放置<pre>个元素，我认为你最好不要使用不间断的空格：

con = con.replace(/  /g, /&nbsp; /);

Answer 3

con = con.replace(/(?:\s|&nbsp;)+/g, '&nbsp; &nbsp; ');

这样做的好处是匹配任意数量的空格（你的appclay's只匹配2个或更多空格），确保4个空格（ruakh's不强制空格数），不会混合<pre>和<p>。所有这些的缺点是它们在innerHTML中使用HTML属性是不安全的，这对您来说可能是也可能不是问题。要解决这个问题，需要解析器或基于DOM的解决方案;如果这是一个问题，请在评论中告诉我，我可以解释如何在DOM中更安全地做到这一点。

编辑：我现在已经考虑了其他形式的空白（例如\t或\n）和现有的 （非破坏空格）。

再次编辑，只是注意到了这一点：

我这样做的原因是因为我试图保留/显示空格字符，如果我将整个段落放在pre元素中，那么自动换行将被禁用。

如果您不需要支持IE7及以下版本，则可以将此样式添加到段落或其父级：white-space: pre-wrap。然后你可以跳过所有这些文本处理。

Answer 4

您需要使用括号创建一个组，然后使用$ 1 ...

引用它

var p = document.getElementById("myP");
var con = p.innerHTML;
con = con.replace(new RegExp("([ ]{2,})"), "<pre>$1</pre>");
p.innerHTML = con;

使用Regex在字符串模式出现之前和之后插入文本

4 个答案: