'브라우저객체'에 해당되는 글 2건

  1. 2012.06.28 [15단원] 브라우저객체
  2. 2012.06.20 [9단원] 객체와 메소드

Ⅰ  브라우저 객체

  - 익스플로러나 넷스케이프와 같은 브라우저 창에 내장되어 있는 객체

  - 브라우저에 있는 문서, 상태 표시줄, 도구 모음과 같은 객체들의 정보를 가지고 다양한 효과를 냄

  - 최상위 객체는 window라는 객체

  - window 객체는 계층적인 구조로 되어 frames, document, history와 같은 하위 객체가 존재

  지금 까지 사용했던 document.write()는 window 객체가 생략되어 사용되었으며 정확한 입력

  방법은 window.document .write()이다. 하지만 매번 반복하여 사용할 경우 상위객체를 생략

  하여 주로 사용

 

 

◈ 브라우저 객체들의 명칭
 


  ◈ 브라우저 객체의 구조 : 다음과 같은 계층적인 구조

 

 

   ① window 객체 : 가장 상위 객체이며 윈도 창을 열거나 창을 제어할 때 사용된다.
   ② history 객체 : 브라우저의 히스토리 정보를 제공하는 객체로 다음 페이지, 이전 페이지로 이동하는 효과를 낼 수 있으며, window.history로 사용된다. 
   ③ location 객체 : window객체의 하위객체로 주소 표시줄의 url 주소에 관한 정보를 제공하는 객체이며, window.location으로 사용된다.
   ④ document 객체 : window객체의 하위객체로 문서의 내용에 관한 정보를 제공하는 객체이다. window.document로 사용한다.
   ⑤ frame 객체 : frame을 제어하는 객체로 window.frame로 사용한다.

 

Ⅱ  Window객체

  - window객체는 최상위 객체로 모든 내장 객체는 window에서 시작됨

  - 모든 하위객체를 표기할 때는 window객체 명을 입력해야 되지만 생략하여 사용되는 경우가 많음

 

  ◈ Window의 각각의 명칭 

 

  ◈ Window객체의 속성

속성

설명

status

상태 표시줄의 내용을 지정한다.

defaultStatus

status의 내용이 지정되지 않았을 때의 내용을 지정한다.

frames

윈도우 객체 안에 들어간 프레임의 정보를 제공한다.

opener

open() 메소드에 의해서 윈도우를 연 문서를 선택한다.

innerHeight

브라우저에서 내용을 볼 수 있는 창의 높이를 지정한다.

innerWidth

브라우저에서 내용을 볼 수 있는 창의 너비를 지정한다.

outerHeight

브라우저의 전체 창의 높이를 지정한다.

outerWidth

브라우저의 전체 창의 너비를 지정한다.

pageXOffset

윈도에 현재 나타나는 페이지의 X 위치를 지정한다.

pageYOffset

윈도에 현재 나타나는 페이지의 Y 위치를 지정한다.

locationbar

locationbar의 표시 여부를 지정한다.

menubar

menubar의 표시 여부를 지정한다.

scrollbars

scrollbar의 표시 여부를 지정한다.

statusbar

statusbar의 표시 여부를 지정한다.

   ※ 회색으로 되어 있는 속성은 넷스케이프에서만 지원되는 속성이다.

 

  ◈ 이벤트 핸들러

이벤트핸들러

설명

onLoad()

문서가 Load될 때 발생한다.

onUnLoad()

문서가 unLoad될 때 발생한다.

onError()

문서 Load 중 에러가 나타나면 발생한다.

onBlur()

문서가 focus를 잃었을 때 발생한다.

onFocus()

문서가 focus를 얻었을 때 발생한다.

onDragDrop()

객체를 DragDrop 시켰을 때 발생한다.

onMove()

윈도를 움직였을 때 발생한다.

onResize()

윈도의 크기를 바꾸었을 때 발생한다.

   ※ 회색으로 되어 있는 속성은 넷스케이프에서만 지원되는 속성이다.

저작자 표시
신고
Posted by 진짜깨비

Ⅰ  객체의 의미 : 창, 폼, 버튼 등

 

  ◈ 객체의 구성 : 객체는 속성과 메소드로 구성 

 객체 = 속성 + 메소드


  ▶ 속성 : 객체가 가지고 있는 상태정보, 객체의 크기나 위치 또는 표시 형태 등을 말함.
               자바스크립트에서의 속성은 창의 메뉴, 도구모음, 주소 표시줄이 되는 것이며,

               주소표시줄의 표시여부나 도구모음의 보여지는 형태 등은 속성 값임.

 
  ▶ 메소드 : 객체가 할 수 있는 동작
                  자바스크립에서는 창을 열거나 닫을 수 있는 것들을 메소드라 할 수 있음

 

  ◈ 객체의 종류
    ① 사용자 정의 객체 : 사용자가 새로운 객체를 만들어 사용 
    ② 내장 객체 : Java Script에서 기본적으로 정의되어 있는 객체, data, string 등

    ③ 브라우저 객체 : window를 최상위 개체로 하여 계층적인 구조를 가지고 있으며,

                              history, document, location 등이 브라우저 객체로 사용됨

    ※ 주로 내장 객체나 브라우저 객체가 사용되며, 사용자 정의 객체는 활용도가 떨어짐

 


Ⅱ  사용자 정의 객체

 

 1단계(객체의 정의) ⇒ 2단계(객체 만들기)

 

  ◈ [1단계] 객체 정의 : 사용자 정의 객체를 정의는 생성자 함수를 이용해서 만든다.

                                  this를 통해 객체의 속성을 지정

[형식] 

               function test(a,b,c)
                {
                this.x=a
                 } 


  ◈ [2단계]객체 만들기 : 생성자 함수로 정의된 객체를 new 예약어를 이용하여 객체로 만든다

[형식]

               <SCRIPT LANGUAGE="Javascript">
               <!--
                 test=new b()
               //-->  
               </SCRIPT>

 

  ☞ 생성자 함수 : 생성자 함수는 객체의 특성과 메소드를 정의 하기위해 사용되는 함수

                         객체가 생성될 때 객체의 기본적인 값을 지정하는 역할을 한다.

 

  ☞ this란? : 생성자 함수에서 만들어지는 객체 자신을 말한다.

                   this.name이라고 하면 a라는 사람의 이름, b라는 사람의 이름을 this라는 예약어를

                   사용하여 쉽게 표현할 수 있다. 


[예제소스]

<HTML>
    <HEAD>
        <TITLE>객체만들기</TITLE>
        <SCRIPT LANGUAGE="Javascript">
        <!--
        function computer(cpu, ram, hdd){
        this.cpu=cpu;
        this.ram=ram;
        this.hdd=hdd;
        }
        -->
        </SCRIPT>
    </HEAD>
    <BODY>
        <h1>객체만들기</h1>
        <SCRIPT LANGUAGE="Javascript">
        <!--
           mycomputer=new computer("pentium 3", 256, "1GHz")   

           document.write("<h3>mycomputer</h3>")
           document.write("CPU 타입 : " +mycomputer.cpu+"/ ")
           document.write("RAM 타입 : " +mycomputer.ram+"/ ")
           document.write("하드디스크 타입 : " +mycomputer.hdd+"<p>")

        -->   
        </SCRIPT>
    </BODY>
</HTML>

 

 

 

 computer라는 객체를 만드는 함수로 cpu,ram,hdd 속성을 가지게 된다. 또한 this연산자를 사용해서 각 속성의 값을 개체에 사용할 수 있도록 정의한 것

 

 

이 부분은 객체를 만드는 부분으로 new연산자를 사용해서 mycomputer라는 이름을 가지는 객체를 만드는 것이다. 또한 mycomputer.cpu, mycomputer.ram, mycomputer.hdd는 computer의 속성 값을 표시하는 것이다

 

저작자 표시
신고

'JavaScript 를 배웁시다.' 카테고리의 다른 글

[11단원] String 객체  (0) 2012.06.22
[10단원] 내장객체와 Data객체  (0) 2012.06.21
[9단원] 객체와 메소드  (0) 2012.06.20
[8단원] 이벤트와 이벤트 핸들러  (0) 2012.06.20
[7단원] 내장함수  (0) 2012.06.19
[6단원] 함수(Function)  (0) 2012.06.18
Posted by 진짜깨비
이전버튼 1 이전버튼

블로그 이미지
진짜깨비
Yesterday6
Today6
Total15,058

달력

 « |  » 2017.12
          1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
31            

최근에 받은 트랙백

글 보관함


티스토리 툴바