[JavaScript] TextArea태그 엔터값 줄 바꿈 처리하기

작성일 | In 
1
2
3
<textarea id="textarea"> </textarea>

<span id="content"></span>

JavaScript를 이용해 바꾸어주기

1
2
3
4
5
6
7
8
// textarea태그값 받아오기
var str = document.getElementById("textarea").value;

// 값에서 엔터를 <br>태그로 변경하기
str = str.replace(/(?:\r\n|\r|\n)/g, "<br />");

// <br>태그로 변경한 값을 다시 넣어주기
document.getElementById("content").innerHTML = str;

Vue에서 적용할 경우

1
<div v-html="str"></div>

참고