[javascript] 문자열의 모든 줄 바꿈을 <br /> 요소로 바꾸려면 어떻게합니까?

JAVASCRIPT / 글쓴이

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