Làm cách nào để thay thế tất cả các ngắt dòng trong một chuỗi bằng các phần tử <br />?

Làm cách nào tôi có thể đọc ngắt dòng từ một giá trị bằng JavaScript và thay thế tất cả các ngắt dòng bằng <br />các phần tử?

Thí dụ:

Một biến được truyền từ PHP như dưới đây:

  "This is man.

     Man like dog.
     Man like to drink.

     Man is the king."

Tôi muốn kết quả của mình trông giống như thế này sau khi JavaScript chuyển đổi nó:

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

Điều này sẽ biến tất cả lợi nhuận thành HTML

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

Trong trường hợp bạn tự hỏi những gì ?: Có nghĩa là. Nó được gọi là một nhóm không bắt giữ. Điều đó có nghĩa là nhóm regex trong ngoặc đơn sẽ không được lưu trong bộ nhớ để được tham chiếu sau. Bạn có thể kiểm tra các chủ đề này để biết thêm thông tin:
https://stackoverflow.com/a/11530881/5042169 https://stackoverflow.com/a/36524555/5042169

Nếu mối quan tâm của bạn chỉ là hiển thị ngắt dòng, bạn có thể làm điều này với CSS.

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

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

Lưu ý : Hãy chú ý đến định dạng mã và thụt lề, vì white-space: pre-linesẽ hiển thị tất cả các dòng mới (ngoại trừ dòng mới cuối cùng sau văn bản, xem fiddle).

Không có regex:

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

Điều này hoạt động cho đầu vào đến từ một vùng văn bản

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

Nếu câu trả lời được chấp nhận không phù hợp với bạn thì bạn có thể thử.

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

Nó làm việc cho tôi.

Bất kể hệ thống:

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

Điều cũng quan trọng là mã hóa phần còn lại của văn bản để bảo vệ khỏi các cuộc tấn công tiêm mã có thể xảy ra

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

Điều này làm việc cho tôi khi giá trị đến từ TextBox:

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

Đối với những người bạn chỉ muốn cho phép tối đa. 2 <br>liên tiếp, bạn có thể sử dụng này:

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

Dòng đầu tiên: Tìm kiếm \nHOẶC \r\nnơi có ít nhất 2 trong số đó là liên tiếp, ví dụ \n\n\n\n. Sau đó thay thế bằng 2br

Dòng thứ hai: Tìm kiếm tất cả đơn \r\nhoặc \nthay thế chúng bằng<br>

nếu bạn gửi biến từ PHP, bạn có thể lấy biến này trước khi gửi:

$string=nl2br($string);

Nó sẽ thay thế tất cả các dòng mới với break

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

Nếu bạn muốn thay thế tất cả các dòng mới bằng một dòng ngắt

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

Đọc thêm về Regex: https://dl.icewarp.com/online_help/203030104.htm điều này sẽ giúp bạn mọi lúc.

Không trả lời câu hỏi cụ thể, nhưng tôi chắc chắn rằng điều này sẽ giúp ai đó ...

Nếu bạn có đầu ra từ PHP mà bạn muốn kết xuất trên trang web bằng JavaScript (có lẽ là kết quả của yêu cầu Ajax) và bạn chỉ muốn giữ lại khoảng trắng và ngắt dòng, hãy xem xét việc đặt văn bản bên trong một <pre></pre>khối:

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

Thử

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>