DOM Area 객체

 

image-map(이미지맵)의 area 객체를 가리킵니다.

 

Area 객체 속성

alt  :  텍스트로 표현되는 값인 alt속성의 값을 반환합니다.

coords  :  맵의 영역을 반환합니다.

shape  :  이미지 맵의 영역의 모양을 나타냅니다. ( rect | circle | poly | default )

 

※ 이미지에 맵을 걸어 링크를 걸었습니다. 이 맵의 링크 영역을 가르키는 것이 coords 속성입니다. 이 속성값을 자바 스크립트로 변경하는 방법은 다음과 같습니다.

 

<img src="test.gif" width="100" height="100" usemap="#test"/>

<map name="test">

    <area id="test" shape="circle" coords="50,50,10" alt="테스트" href="index.html"/>

</map>

<script type="text/javascript">

x = document.getElementById("test");

x.coords = "20,20,10";    // 값을 ""(인용구) 안에 작성하면 됩니다.

document.writｅ( x.coords );

</script>

 

또 Map 객체에 Area 객체가 여러 개일 경우 접근하는 방법은다음과 같습니다.

 

<img src="test.gif" width="100" height="100" usemap="#test"/>

<map name="test">

    <area id="test" shape="circle" coords="50,50,10" alt="테스트" href="index.html"/>

     <area id="test" shape="circle" coords="80,80,10" alt="테스트2" href="index.html"/>

</map>

<script type="text/javascript">

    x = ducument.getElementById("test").getElementsByTagName("area");

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

        x[i].coords = "0,0,0";

    }

</script>