如何用js替換文本里的換行符 \n?

有下面一段文本, 在編輯器里的格式如下:

<div id="foo">
line1
line2
line3
</div>

切換到瀏覽器, 顯示如下

line1line2line3

這里我想使瀏覽器顯示效果變成如下形式

line1
line2
line3

編輯器里回車產生的換行符\n是不可見的, 這里我們用js把\n替換為<br>

嘗試如下代碼:

var txt=$('#id').html();
txts=txts.replace('\n','<br>')
$('.wra').html(txts);

無效, 因為replace()方法只替換匹配到的第一個字符

如下為正確代碼:

var txts = $('.wra').html();
txts=txts.replace(/\n/g,'<br>')
$('.wra').html(txts);

使用帶有g標識的正則, 可以搜索並替換所有匹配的字符

值得一提的是, 換行符因為操作系統不同會有差異, 因此使用下面的方法更加安全:

var txts = $('.wra').html();
txts=txts.replace(/[\n\r]/g,'<br>')
$('.wra').html(txts);