Bagaimana cara mengganti semua jeda baris dalam string dengan elemen <br />?

Bagaimana saya bisa membaca jeda baris dari nilai dengan JavaScript dan mengganti semua jeda baris dengan <br />elemen?

Contoh:

Variabel lulus dari PHP seperti di bawah ini:

  "This is man.

     Man like dog.
     Man like to drink.

     Man is the king."

Saya ingin hasil saya terlihat seperti ini setelah JavaScript mengubahnya:

  "This is man<br /><br />Man like dog.<br />Man like to drink.<br /><br />Man is the king."

Ini akan mengubah semua pengembalian menjadi HTML

str = str.replace(/(?:\r\n|\r|\n)/g, '<br>');

Jika Anda bertanya-tanya apa?: Artinya. Ini disebut grup yang tidak menangkap. Ini berarti bahwa grup regex di dalam tanda kurung tidak akan disimpan dalam memori untuk direferensikan nanti. Anda dapat memeriksa utas ini untuk informasi lebih lanjut:
https://stackoverflow.com/a/11530881/5042169 https://stackoverflow.com/a/36524555/5042169

Jika kekhawatiran Anda hanya menampilkan linebreak, Anda bisa melakukannya dengan CSS.

<div style="white-space: pre-line">Some test
with linebreaks</div>

Jsfiddle: https://jsfiddle.net/5bvtL6do/2/

Catatan : Perhatikan pemformatan dan indentasi kode, karena white-space: pre-lineakan menampilkan semua baris baru (kecuali baris baru terakhir setelah teks, lihat biola).

Tanpa regex:

str = str.split("\n").join("<br />");

Ini berfungsi untuk input yang berasal dari textarea

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

Jika jawaban yang diterima tidak berfungsi untuk Anda, maka Anda dapat mencoba.

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

Ini berhasil untuk saya.

Terlepas dari sistem:

my_multiline_text.replace(/$/mg,'<br>');

Penting juga untuk menyandikan sisa teks untuk melindungi dari kemungkinan serangan injeksi skrip

function insertTextWithLineBreaks(text, targetElement) {
    var textWithNormalizedLineBreaks = text.replace('\r\n', '\n');
    var textParts = textWithNormalizedLineBreaks.split('\n');

    for (var i = 0; i < textParts.length; i++) {
        targetElement.appendChild(document.createTextNode(textParts[i]));
        if (i < textParts.length - 1) {
            targetElement.appendChild(document.createElement('br'));
        }
    }
}

Ini bekerja untuk saya ketika nilai berasal dari TextBox:

string.replace(/\n|\r\n|\r/g, '<br/>');

Bagi Anda yang hanya ingin memperbolehkan maks. 2 <br>berturut-turut, Anda dapat menggunakan ini:

let text = text.replace(/(\r?\n){2,}/g, '<br><br>');
text = text.replace(/(\r?\n)/g, '<br>');

Baris pertama: Cari \nATAU \r\ndi mana setidaknya 2 dari mereka berturut-turut, misalnya \n\n\n\n. Kemudian gantilah dengan 2br

Baris kedua: Cari semua \r\natau \nganti dengan<br>

jika Anda mengirim variabel dari PHP, Anda bisa mendapatkannya dengan ini sebelum mengirim:

$string=nl2br($string);

Itu akan mengganti semua baris baru dengan break

str = str.replace(/\n/g, '<br>')

Jika Anda ingin mengganti semua baris baru dengan satu baris break

str = str.replace(/\n*\n/g, '<br>')

Baca lebih lanjut tentang Regex: https://dl.icewarp.com/online_help/203030104.htm ini akan membantu Anda setiap saat.

Tidak menjawab pertanyaan spesifik, tetapi saya yakin ini akan membantu seseorang ...

Jika Anda memiliki output dari PHP yang ingin Anda render di halaman web menggunakan JavaScript (mungkin hasil dari permintaan Ajax), dan Anda hanya ingin mempertahankan spasi putih dan pemisah baris, pertimbangkan untuk menyertakan teks di dalam <pre></pre>blok:

var text_with_line_breaks = retrieve_some_text_from_php();
var element = document.querySelectorAll('#output');
element.innerHTML = '<pre>' + text_with_line_breaks + '</pre>';

Mencoba

let s=`This is man.

     Man like dog.
     Man like to drink.

     Man is the king.`;
     
msg.innerHTML = s.replace(/\n/g,"<br />");

<div id="msg"></div>