0
 5   1   1
  View Articles

Name  
   손병목  (2002-05-22 00:46:18, Hit : 12925, Vote : 1318)
Homepage  
   http://www.itmembers.net
Subject  
   개념잡기(2) - 속성, 이벤트, 이벤트 핸들러 이해하기
지난 시간에 Date() 개체를 통해 개체와 인스턴스, 메소드 등에 대해 알아보았습니다.
이번 시간에는 onMouseOver 이벤트를 통해 이벤트와 이벤트 핸들러, 아울러 개체의 속성에 대한 개념까지 짚고 넘어가도록 하겠습니다.

그런데 이번 시간에 다루는 것은 자바스크립트의 관련 내용이라기 보다는 HTML 관련 내용입니다.
그러나 이러한 식의 이벤트 핸들러와 자바스크립트를 함께 활용하는 예가 매우 많으므로 꼭 짚고 넘어가야할 것 같아서 다루는 것입니다.

이번 시간에 다룰 예제는 다음과 같습니다.

<HTML>
<HEAD><TITLE>자바스크립트 강좌 5</TITLE></HEAD>
<BODY>
<A HREF="http://www.itmembers.net" onMouseOver="window.status='나눔의 미덕 Itmembers.net으로 이동합니다.'; return true">ITmembers.net 바로가기</A> </BODY>


일단 결과부터 확인하고 설명드리는 것이 빠르겠네요.

먼저 지금 웹브라우저의 상태 표시줄을 확인해보세요. 뭐라고 씌여있나요? (상태 표시줄이 어디냐믄요, 웹브라우저 가장 하단 왼쪽을 말합니다. 일반적으로 '완료'라고 표시되는 것이 정상이며, 링크된 문자열에 마우스를 대면 링크 주소가 표시됩니다.)

그런 다음, 아래 링크에 마우스 포인터를 올려 보세요. 그리고 다시 상태 표시줄을 확인해 보세요.

ITmembers.net 바로가기


상태 표시줄의 내용이 바뀝니다


어떻습니까? 나눔의 미덕 Itmembers.net으로 이동합니다.라는 말이 보이죠?
다시 확인하시려면 '새로 고침'을 누르거나 [F5] 키를 눌러 처음 상태로 만든 다음 확인해 보세요.

이제 설명드리겠습니다.

onMouseOver="window.status='나눔의 미덕 Itmembers.net으로 이동합니다.';  return true"


여기서 onMouseOver라는 것이 이벤트입니다. 마우스 포인트를 올려 놓으면∼이라는 뜻이죠.
그러면 window 개체의 status 속성을 '나눔의 미덕 Itmembers.net으로 이동합니다'로 바꾸라는 뜻입니다.
개체 뒤에는 메소드와 속성이 올 수 있습니다. 보통 메소드는 동사를 씁니다.
document.wirte, OpenToday.getMonth()처럼 말입니다.
그러나 개체 뒤에 쓰이는 명사는 대개 그 개체의 속성을 나타냅니다.

위의 예에서는 window 개체(즉 현재 열려 있는 웹브라우저)의 status 속성(즉 상태 표시줄의 값)에 새로운 값을 대입하는 것을 보여주고 있습니다.

정리할께요.
위의 예에서 onMouseOver는 이벤트입니다. 그리고 'onMouseOver라는 이벤트가 발생했을 때 어떻게 하라'라고 프로그래밍을 한 것을 이벤트 핸들러라고 합니다. 즉 이벤트가 발생했을 때 그 이벤트를 가로채서 핸들링하도록 하는 것이죠. 마지막으로 window.status에서 status는 현재 윈도우의 상태 표시줄에 해당되는 속성입니다.

위의 예에서 return true라는 문장을 빼거나 return false로 바꿨을 경우에 어떤 결과가 나타날까요?
이건 숙제!

숙제 내는 김에 하나 더 내볼까요?
위의 문장에서
window.status='나눔의 미덕 Itmembers.net으로 이동합니다. 대신 document.bgColor='yellow'로 바꾸면 어떻게 될까요?

이상 동주 아빠 손병목이었습니다.

Next
   개념잡기(1) - 개체, 인스턴스, 메소드 이해하기

손병목


Copyright 1999-2020 Zeroboard / skin by Zetyx