고수준과 저수준 프로그래밍 언어 비교
HTML
DOM은 2진트리와 마찬가지로 DAG의 하위 집합인 트리
<div string="동물이 짖습니까?">
<div string="개"></div>
<div string="고양이></div>
</div>
애플리케이션 수준의 뼈대
<html lang="ko">
<head>
<title>제목</title>
<style>
css...
</style>
<script type="text/javascript">
$(function() {
javascript 넣기...
});
</script>
</head>
<body>
...위 HTML을 여기에 넣기
</body>
</html>
웹 페이지 본문 <body>
### 질문과 함께 자식 노드(개, 고양이) 함께 읽어옴
### 자식 노트가 표시되지 않도록 <div>로 감싸서 숨김
<div id="root" class="invisible">
<div string="동물이 짖습니까?">
<div string="개"></div>
<div string="고양이></div>
</div>
</div>
<div id="dialog">
...대화 추가
</div>
### 대화가 시작되면 보이지 않게 start-hidden 클래스로 지정
...새로운 동물 이름을 얻는 대화
<div id="what-is-it" class="start-hidden">
<input id="what" type="text" />
<button id="done-what">이름 입력 완료</button>
</div>
...새로운 동물에 대한 질문을 얻는 대화
<div id="new-question" class="start-hidden">
...
...예, 아니오 버튼
자바스크립트
위 웹사이트 뼈대에서 자바스크립트 넣는 부분
node
변수 선언 먼저하기