©TCP-tryWWW

<!DOCTYPE html>
<html lang="ko">

<head>
	<meta charset="UTF-8">
	<title>JavaScript Node Manage</title>
</head>

<body>

	<h1>요소 노드의 생성</h1>
	<p id="text">새로운 단락을 생성하여 이 단락 앞에 추가할 것입니다.</p>
	<button onclick="createNode()">요소 노드 생성!</button>

	<script>
		function createNode() {
			var criteriaNode = document.getElementById("text");	// 기준이 되는 요소로 아이디가 "text"인 요소를 선택함.
			var newNode = document.createElement("p");			// 새로운 <p> 요소를 생성함.
			newNode.innerHTML = "새로운 단락입니다.";
			document.body.insertBefore(newNode, criteriaNode);	// 새로운 요소를 기준이 되는 요소 바로 앞에 추가함.
		}
	</script>
	
</body>

</html>