javascript textarea 줄바꿈처리

자바스크립트에서 textarea에 입력받은 문자열 혹은 값들을 똑같이 보여주고 싶을 때 (예를들면 엔터로 줄바꿈을 해서 입력했으면 그 사항까지 똑같이 가져갈 수 있게) 구글링 하다보면 replace를 쓰라는 말이 많았는데 내가 해보니까 딱 한번만 개행되고 그 다음부턴 개행이 먹지 않는다. 그리고 replaceAll이라는 메소드는 아마 js에서 제공을 안해주는 것 같다.

내가 위에 설명한 걸 간단하게 그림으로 보여주자면

이런 textarea 창에 저런 식으로 입력하고 전송을 누르면 

이런식으로 전송되게 하는 식이고 이 화면을 소스보기를 누르면

#include<stdio.h><br>int main()<br>{<br>printf("ddd");<br>return 0;<br>}

와 같이 <br> 개행처리가 된 상태로 소스가 나오게 된다.  

 html 기본 폼 설명은 생략하겠다.

일단 textarea에 값을 받아오게 되면 그 문자열은 한줄로 쭉 나열되어있다.

나는 현재 node js 환경에서 실습하는 터라 일반적인 자바스크립트 코드와 다른점이 좀 있어서 해당 기능만 설명하자면

textarea에 입력된 값을 받아온 변수를 code라 가정하겠다.

code.split(/\r\n|\r\n/);

이렇게 코드를 치게되면 개행이 될 때마다 배열 인덱스를 하나씩 늘려서 저장을 하게된다. 즉,

{ '#include<stdio.h>' , 'int main()' , '{' , 'printf("ddd");' ......}

이런식으로 배열형태로 저장이 된다는 것이다.

code.split(/\r\n|\r\n/).join("<br>");

이렇게 뒤에 join을 붙여주게 되면 개행이 되는 부분을 <br>태그로 바꿔서 표현해주겠다는 것이다.

그렇게 되면 html 코드에서도 개행된 형태로 화면에 보여주는 것이 가능하다.