10. Navigator 객체


10.8 form object

  지금까지 배운 모든 객체를 다 합친 것 보다 많은 양을 배우게 된다. 이 객체가 실제로 가장 많이 쓰인다. form 과 함께사용되는 이벤트중 가장 보편적인 이벤트는 blur, focus, chage, click, submit이며, 이벤트 헨들러는 각각 onBlur, onFocus, onChange, onClick, onSubmit이다.

  다음과 같은 HTML문서가 있다고 하면,

<FORM NAME="fm1">
.........
</FORM>

<FORM NAME="fm2">
.........
</FORM>
  자바스크립트에서 각 FORM 객체에 접근하기 위해서는 window.document.fm1이라고 써주면 된다. 물론 window객체는 기본으로 적용되니까 생략하여 그냥 document.fm1이라고 써주면 첫 번째 form까지 접근할 수 있는 것이다.

  위의 예에서 FORM 객체가 2개가 존재하므로,

document.fm1 == document.forms[0];
document.fm2 == document.forms[1];
  이라는 등식이 성립되기도 한다.

  • 주요 속성

    actionFORM Tag의 ACTION속성
    elements[i]Form의 하위 요소들에 대한 배열
    encodingFORM Tag의 ENCTYPE속성
    methodFORM Tag의 METHOD속성
    targetFORM Tag의 TARGET속성


  • 하위 요소 접근

      다음과 같은 HTML문서가 있다고 하자.

    <FORM NAME=fm METHOD=GET ACTION="test.asp">
        <INPUT TYPE=text NAME=txt_name>
        <SELECT NAME=sel_type>
           <OPTION> Red </OPTION>
           <OPTION> Green </OPTION>
           <OPTION> Blue </OPTION>
        </SELECT>
        <TEXTAREA NAME=txt_area></TEXTAREA>
    </FORM>


      txt_name이라는 이름을 가지고 있는 text박스에 접근하려고 한다. 그럼,

    document.fm.txt_name
      이렇게 작성하면 된다. 나머지 것들도,

    document.fm.sel_type : SELECT
    document.fm.txt_area : TEXTAREA
      이름을 줘야만 이렇게 하는 것이 가능하다. 만일 이름을 주지 않았다면,

    document.fm.txt_name == document.fm.elements[0];
    document.fm.sel_name == document.fm.elements[1];
    document.fm.txt_area == document.fm.elements[2];
      와 같이 접근해야 한다. 배열의 순서는 HTML문서상에 나타나는 순서대로 적용이 된다.

    NAME  반드시 이름을 줘서 사용하는 것이 좋다. 입력 폼이 복잡한 경우가 있고, 또 TABLE과 같이 쓰이면 HTML상에 나오는 순서하고 눈에 보이는 순서하고 맞지 않아서 무지하게 고생하게 된다.! 더구나 가끔씩 브라우저도 그 순서를 엉망으로 만드는 경우도 발생한다.


- Last Update : 2001.7.3 by Deadfire(http://www.deadfire.net)

Javascript 강좌
들어가기
Javascript란?
작동 방식
장 단 점
기 초
     - HTML문서에추가하기
     - 최초 예제
     - 함수사용하기
     - 기본 함수
문 법
     - 변 수
     - 연 산
     - 조 건 문
     - 반 복 문
     - 사용자함수
객 체
     - Object란?
     - 속성과 함수
     - 객체의 생성과사용
내장 객체
     - Date
     - Math
     - String
     - Array
     - Boolean
     - Function
     - Argument
     - Number
     - Global
     - 기 타
     - with / delete
Event 객체
네비게이터 객체
     - 네비게이터객체구조
     - 객체 접근 방법
     - navigator
     - window
     - location
     - history
     - document
     - form
     - form elements
Frame 객체
기 타
     - Animation
     - Audio
마치며

Copyright ⓒ 1997 ~, Deadfire Program Master