2010년 11월 24일 수요일

javascript getElementBy-----() 함수 : IE(InternetExplorer)와 FF(FireFox) 차이

1. getElementById() - document.getElementByid("값")

 

- id를 이용해서 특정 태그 객체를 찾음.

 

- id는 원래 html 문서내에서 유일해야 하므로 지정된 id를 가진 태그가 없거나,

 

  두개 이상이면 getElementByid 메서드는  null로 리턴.

 

ex) 

 

<script type="text/javascript">

    var a = document.getElementByid("test");

    alert(a.value);

</script>

 

<input id="test" value="one">

 

# IE : ID와 Name 둘다 찾아 먼저 나온 것 하나를 return.

  ( IE8부터 FF와 동일하게 ID만 찾음 )

# FF : ID만 찾아 먼저 나온 것 하나를 return.

 

 

2. getElementsByName() - document.getElementsByName("값")

 

- name 이 같은 객체를 배열로 가져오는 매소드.

 

- 지정된 이름이나 태그이름을 가진 태그 객체의 배열을 리턴하며,

 

  객체를 찾지 못하면 길이가 0인 배열을 리턴함.

 

- 중복되지 않게 이름을 고유하게 줬더라고 배열로 들어와서 0번을 차지함.

 

# getElementByName 이란 method는 존재하지 않음.

 

ex)

 

<script type="text/javascript">

    var a = document.getElementsByName("test");

    document.write("배열 값 출력 : ");

    for(var i=0; i<a.length; i++){

        document.write(a.value[i] + " ");

    }

</script>

 

<input type="text" name="NAME" />

<input type="hidden" name="test" value="one" />

<input type="hidden" name="test" value="two" />

<input type="hidden" name="test" value="three" />

 

3. getElementByTagName() - document.getElementsByTagName("태그명")

 

- 요소노드의 태그명을 가지고 접근하는 메소드.

 

ex)

<script type="text/javascript">

    function fun(){

        var items = document.getElementsByTagName("");

        alert(items.length);

        window.onload = func;

    }

</script>

 

 

 

- 문서내의 태그명들을 모두 불러와 items 이라는 변수에 저장하게 된다.  

 

- items 라는 변수는 물론 객체변수이고, 만약에 문서내 태그명들이 여러개라면

 

  items라는 변수는 1차원 배열이 된다. (items[0], items[1], items[2] ... )

 

- items.length : 문서내에 존재하는 태그의 갯수이다.

 

 

 

 

 

댓글 없음:

댓글 쓰기