[한빛미디어] 인터넷 프로그래밍 입문 15장 연습문제
15장 연습문제(자바스크립트)
서술형문제
1. 자바스크립트가 자바와 다른 점을 중심으로 특징을 아는 대로 서술하시오.
구분 |
자바 |
자바스크립트 |
해석 위치 |
서버 내의 파서 |
클라이언트의 브라우저 |
언어형 |
컴파일러 방식 |
인터프리터 방식 |
존재 |
HTML 파일과 별도로 존재 |
HTML 문서 내에 기술 |
객체 지향 |
객체 지향 언어 |
객체 기반 언어 |
바인딩 |
정적 바인딩 |
동적 바인딩 |
소스 |
확인 불가능 |
확인 가능 |
보안성 |
있음 |
없음 |
변수형 |
변수, 자료형의 정의가 있고 명확하게 구분 |
변수의 형을 미리 정의하지 않아도 됨 |
속도 |
빠름 |
느림 |
사용 |
어려움 |
쉬움 |
운영체제 |
부분적인 제한 |
제한 없음 |
2. 자바스크립트 기본 구조를 쓰시오.
<script language="javascript"> <!-- ~~ 자바 스크립트 내용 ~~ // --> </script> |
3. 자바스크립트 작성 시 객체, 속성, 메소드, 함수를 나열할 경우 어떤 구분자를 사용하는가?
▶▶ 마침표(.)
4. 자바스크립트에서 개행을 처리하는 특수문자는 무엇인가?
▶▶ \n
5. 자바스크립트에서 프로그램의 대상이 되는 모든 것을 가리키는 말로 창, 문서, 그림 등을 가리켜 무엇이라고 하는가?
▶▶ 객체
6. 사용자의 행위를 전달하는 시점으로 자바스크립트가 실행되는 시점을 알려주는 역할을 하는 것은 무엇인가?
▶▶ 이벤트 핸들러
7. <script> 태그에 대한 구문 구조의 기본 형태를 설명하라.
<script language="javascript"> // 자바스크립트 버전 표시 ex) <script language="javascript1.2"> <!-- // 생략 부호 ~~ 자바 스크립트 내용 ~~ // --> </script> |
8. 자바스크립트에서 사용 가능한 주석의 형태를 설명하라.
한 행을 주석문 처리 - // 주석 처리할 행, 문장
두행 이상에 걸치는 주석문 처리 - /* 주석 처리할 영역 */ |
실습형문제
1. 내 홈페이지를 즐겨찾기에 추가하기
ㆍ앞에서 배운 내용은 아니지만 간단한 소스로 완성된 결과를 확인해 불 수 있으므로 다음 코드처럼 입력해본다. <a href=# onclick="window.external.addfavorite('http://www.naver.com','네이버(자바스크립트)')'> 즐겨찾기에 추가!</a> ㆍ즐겨찾기에 추가하는 소스는 다음 문법에 맞게 작성한다. window.external.addfavorite('URL주소','사이트명') ㆍ에디트플러스에서는 결과를 확인할 수 없으므로 인터넷 익스플로러에서 확인한다. |
<html> <head> <title>내 홈페이지를 즐겨찾기에 등록하기!</title> <style>a{color:white;text-decoration:none}</style> </head>
<body bgcolor=black background="images/bg.jpg" leftmargin=0 topmargin=0>
<table width=800 border=0 cellpadding=0 cellspacing=0> <tr height=284> <td background="images/main_01.jpg" valign=bottom> </td> </tr> <tr height=121><td background="images/main_02.jpg" valign=top> <!-- 종속테이블 시작 --> <table width=300 border=0><tr><td align=right><br>
<!-- 코딩1 --> <a HREF=# onclick="window.external.addfavorite('http://www.naver.com','네이버(자바스크립트)')"> 즐겨찾기에 추가!</a>
</td></tr></table> <!-- 종속테이블 끝 -->
</td></tr> <tr height=195><td> </td></tr></table> </body> </html> |
|
2. 압력상자에 메시지 보여주기
<html> <head> <title> 오늘의 명언 </title>
<style type="text/css"> body { scrollbar-face-color: #dedede; /*스크롤 이동탭 내부색*/ scrollbar-shadow-color: #cccccc; /*오른쪽,하단 테두리색*/ scrollbar-highlight-color: #ffffff; /*왼쪽,상단 테두리색*/ scrollbar-3dlight-color: #dedede; /*좌측,상단 바깥 테두리색*/ scrollbar-darkshadow-color: #ffffff; /*우측,하단 바깥 테두리색*/ scrollbar-track-color: #f0f0f0; /*스크롤바 내부색*/ scrollbar-arrow-color: #dedede /*이동버튼 화살표색*/ } textarea{border:1 solid #dedede} a{color:black; text-decoration:none} a:hover{font-size:12pt;} </style> </head> <body text=gray> <table width=100% height=100% border=0> <tr> <td> <!-- 종속테이블 시작 --> <table width=450 height=380 background="box.jpg" align=center> <tr> <td> <h3 align=center>오늘의 명언</h3>
<center><!-- 코딩1 --> <textarea name="saying" rows="8" cols="40">아래 글자에 마우스를 올려보세요~</textarea><br><br>
<!-- 코딩2 --> <a href=# onmouseover="saying.value='당신이 어디에 있는지, 어디를 향해 가고 있는지도 모를 정도로 바쁘게 살진 말라.'" onmouseout="saying.value='아래 글자에 마우스를 올려보세요~'">한글</a>
<!-- 코딩3 --> <a href=# onmouseover="saying.value='Don\'t run through life so fast that you forget not only where you\'ve been but also where you are going. '" onmouseout="saying.value='아래 글자에 마우스를 올려보세요~'">영문</a> <br><br> </center></td></tr></table></td></tr></table></body></html> |
|
ㆍ<textarea> 태그의 이름을 saying으로 지정 ㆍ<a> 태그에 마우스가 올라오면 saying 객체의 value 속성을 변경하도록 지정 ㆍ마우스가 올라올 때 나타나는 문자는 소스의 주석 문자로 사용 ㆍ마우스가 벗어나면 원래 상태로 복구 |
심화 연습 문제
1. 문제 정답 확인하기
~ 상단 생략 ~ <tr> <td bgcolor=F8DAA8 colspan=2 background="images/coffee_bg.gif"> <div><br><br>
<!-- 설명 시작 ********************************** -->
커피라는 말의 뿌리는 에티오피아의 카파(caffa)라는 말에서 찾을 수 있다. 카파란 아랍어로 무슨 뜻을 가진 말일가?<br>
<!-- 코딩1 --> <a href=# onclick="ans1.value='힘'">[정답보기]</a> <input type="text" name="ans1"><br><br> 카파가 아라비아에서 'qahwa' (와인의 아랍어)가 되고 터키에 건너와 '카베(kqhve)'로 유럽에 건너가 '카페(cafe)', 미국에서는 '커피', 일본에서는 무엇이라 불려지는가?<br> <!-- 코딩2 --> <a href=# onclick="ans2.value='고히'">[정답보기]</a> <input type="text" name="ans2"><br><br>
<!-- 코딩3 --> <center><a href=# onclick="ans1.value='';ans2.value=''">[다시 풀기]</a></center> <!-- 설명 끝 ********************************** --> ~ 이하 생략 ~ |
|
ㆍ<!--코딩1-->: 입력상자의 이름을 ans1로 지정하고 [정답보기] 문자를 클릭하면 입력상자에 정답 ‘힘’이 표시되게 설정 ㆍ<!--코딩2-->: <!--코딩1-->과 같은 방식으로 만들고 정답은 ‘고히’로 표시되게 설정 ㆍ<!--코딩3-->: [다시 풀기] 문자를 선택하면 입력상자에 입력된 값을 제거하고 초기화시킴 |
'Book' 카테고리의 다른 글
[한빛미디어] 인터넷 프로그래밍 입문 17장 연습문제 (0) | 2009.06.05 |
---|---|
[한빛미디어] 인터넷 프로그래밍 입문 16장 연습문제 (0) | 2009.06.05 |
[한빛미디어] 인터넷 프로그래밍 입문 14장 연습문제 (0) | 2009.05.29 |
[한빛미디어] 인터넷 프로그래밍 입문 13장 연습문제 (0) | 2009.05.29 |
[한빛미디어] C로 배우는 쉬운 자료구조 - 5장 연습문제 (0) | 2009.05.08 |