웹개발
[명품 웹 프로그래밍] 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) 가능.