textarea 입력대로 화면에 출력하기
<!DOCTYPE html>
<head>
<title>Recipe</title>
<script>
window.onload=function() {
document.getElementById("preview").onclick=processText;
}
function processText() {
var txtBox = document.getElementById("inputbox");
var lines = txtBox.value.split("\n");
// generate HTML version of text
var resultString = "<p>";
for (var i = 0; i < lines.length; i++) {
resultString += lines[i] + "<br />";
}
resultString += "</p>";
// print out to page
var blk = document.getElementById("result");
blk.innerHTML = resultString;
}
</script>
</head>
<body>
<textarea id="inputbox" cols="20" rows="10"></textarea>
<div><button id="preview">Preview</button></div>
<div id="result"></div>
</body>
textarea를 줄별로 처리하기
//줄 바꿈 문자를 기준으로 textarea 문자열을 분리
var txtBox = document.getElementById("inputbox");
var lines = txtBox.value.split("\n");
//내용을 HTML 버전으로 변경
var resultString = "<p>";
for (var i = 0; i < lines.length; i++) {
resultString += lines[i] + "<br>";
}
resultString += "</p>";
//페이지에 출력
var blk = document.getElementById("result");
blk.innerHTML = resultString;