JavaScript 将 \n 替换为 <br /> [重复]

Posted 2023-03-11

【中文标题】JavaScript 将 \\n 替换为 <br /> [重复]

【英文标题】：JavaScript replace \n with <br /> [duplicate]JavaScript 将 \n 替换为 <br /> [重复]

【发布时间】：2011-07-01 21:06:24

【问题描述】：

var messagetoSend = $.trim(document.getElementById("msgText").value);
messagetoSend = messagetoSend.replace("\n", "<br />");
alert(messagetoSend);

给定输入：

Line 1


Line 2




Line 3

此提醒：

Line 1<br />


Line 2




Line 3

当我希望它发出警报时：

Line 1<br /><br /><br />Line 2<br /><br /><br /><br /><br />Line 3

【问题讨论】：

鉴于字符串是 html 而不是纯文本，只需设置它的样式，以便 \n 导致换行，white-space: pre; 否则你最终会破坏包含 \n 的实体，如果它实际上是文本，恭喜你现在拥有一个 XSS 漏洞。

【参考方案1】：

global matching 需要 /g

replace(/\n/g, "<br />");

这对我有用 \n - 如果您可能有 \r\n，请参阅 this answer

注意：The dupe 是\r\n、\r 或\n 任意组合的最完整答案

var messagetoSend = document.getElementById('x').value.replace(/\n/g, "<br />");
console.log(messagetoSend);

<textarea id="x" rows="9">
    Line 1
    
    
    Line 2
    
    
    
    
    Line 3
</textarea>

更新

似乎这个问题的一些访问者的文本带有折线转义为

一些文本\r\n超过一行"

在这种情况下，您需要转义斜杠：

replace(/\\r\\n/g, "<br />");

注意：所有浏览器在渲染时都会忽略字符串中的\r。

【讨论】：

我改成这个了，好像不行。它不会取代任何东西。

"g" 还是只加一个 regexp 什么都不做

不知道为什么，但对我来说replace(/\\n/g,"<br />") 有效。我有点困惑。 ://

这是换行符的文本表示。这是纯JS还是php中的字符串或类似的

@mplungjan 我创建了一个名为 ln2br 的函数。然后副驾驶在这个答案的开头建议了正则表达式:))

【参考方案2】：

处理任一类型的换行符

str.replace(new RegExp('\r?\n','g'), '<br />');

【讨论】：

投票赞成和选择的答案对我不起作用；我用了这个答案！谢谢。

这是最好的答案，非常感谢@WSKinner

这解决了整个问题，因为以前的问题以某种方式替换了我每一行的最后一个字符。

不处理\r 没有\n。

【参考方案3】：

对.replace()使用正则表达式：

messagetoSend = messagetoSend.replace(/\n/g, "<br />");

如果这些换行符是由 windows 编码进行的，您还必须替换 carriage return。

messagetoSend = messagetoSend.replace(/\r\n/g, "<br />");

【讨论】：

我改成这个了，好像不行。它不会取代任何东西。

@Tom：可能是 Windows 换行符？我更新了代码，也试试回车。

它是 \n 而不是 \\n - 我认为我的回答已经解决了这个问题。 \r 可以忽略 - 浏览器将