웹개발

[명품 웹 프로그래밍] 8장 실습문제 9, 라면 끓이는 순서 입력받기

hatch 2021. 12. 11. 03:23
728x90
반응형
실행 화면
초기 화면 입력 후 화면

 

<자바 스크립트 코드>

 

<!DOCTYPE html>
<html><head><meta charset="UTF-8">
<title>x</title>
</head>
<body>
<h3>라면 끓이는 순서</h3>
<hr>
<ol type="A" style="background-color: yellowgreen" onclick="add()" id="rameon">
	<li>물 끓임.</li>
</ol>
<script>
function add() {
	var text = prompt("라면을 끓이는 순서를 입력하라");
	
	if(text == null || text == "") return;

	var newNode = document.createElement("li");
	newNode.innerHTML = text;
	document.getElementById("rameon").appendChild(newNode);
}
</script></body></html>

 

1. 복습

- 라면 리스트.. ol 에서 onclick = "add(this)" / add(obj) { } 로 바꿀 수 있음.

  >> 리스트 추가할 때 ol id 찾는 게 아니라 obj.appendChild(newNode) 가능.