Як замінити всі розриви рядків у рядку елементами <br />?

Як я можу прочитати розрив рядка зі значення JavaScript та замінити всі перерви рядка <br />елементами?

Приклад:

Змінна передана від PHP, як показано нижче:

  "This is man.

     Man like dog.
     Man like to drink.

     Man is the king."

Я хотів би, щоб мій результат виглядав приблизно так, після перетворення JavaScript:

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

Це перетворить усі прибутки в HTML

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

Якщо вам цікаво, що?: Означає. Його називають групою, яка не захоплює. Це означає, що група регулярних виразів в дужках не буде збережена в пам'яті, на яку буде посилатися пізніше. Ви можете ознайомитись з цими потоками для отримання додаткової інформації:
https://stackoverflow.com/a/11530881/5042169 https://stackoverflow.com/a/36524555/5042169

Якщо ваше занепокоєння є лише відображенням рядкових рядків, ви можете зробити це за допомогою CSS.

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

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

Примітка . Зверніть увагу на форматування коду та відступ, оскільки white-space: pre-lineвідображатимуться всі нові рядки (крім останнього нового рядка після тексту, див. Скрипку).

Без регулярного вираження:

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

Це працює для введення даних із текстової області

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

Якщо прийнята відповідь не працює для вас, ви можете спробувати.

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

Це працювало для мене.

Незалежно від системи:

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

Також важливо кодувати решту тексту, щоб захистити від можливих атак на введення сценарію

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'));
        }
    }
}

Це працювало для мене, коли значення надходило з TextBox:

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

Для тих із вас, хто просто хоче дозволити макс. 2 <br>підряд, ви можете використовувати це:

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

Перший рядок: шукайте \nАБО \r\nтам, де принаймні 2 з них є підряд, наприклад \n\n\n\n. Потім замініть його на 2br

Другий рядок: знайдіть усіх одиночних \r\nабо \nзамініть їх<br>

якщо ви надсилаєте змінну з PHP, ви можете отримати її за допомогою цього, перш ніж надсилати:

$string=nl2br($string);

Він замінить всю нову лінію на перерву

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

Якщо ви хочете замінити всю нову лінію на одну лінію розриву

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

Детальніше про Regex читайте: https://dl.icewarp.com/online_help/203030104.htm, це допоможе вам щоразу.

Не відповідаючи на конкретне запитання, але я впевнений, що це допоможе комусь ...

Якщо у вас є вихід з PHP, який ви хочете візуалізувати на веб-сторінці за допомогою JavaScript (можливо, результат запиту Ajax), і ви просто хочете зберегти пробіл та розриви рядків, подумайте про те, що просто вкладете текст всередину <pre></pre>блоку:

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

Спробуйте

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>