이미지의 usemap 속성 값을 가져오려면 JavaScript에서 제공하는 useMap 프로퍼티를 사용하면 됩니다. usemap 속성은 이미지 맵(image map)을 정의할 때 사용되며, 이미지 위의 특정 영역을 클릭 가능한 링크로 만들어 줍니다.
예제
아래 코드를 실행하면 이미지 요소에 설정된 usemap 속성 값을 화면에 출력할 수 있습니다.
<!DOCTYPE html>
<html>
<body>
<img id = "myid" src = "/images/html.gif" alt = "HTML Map" usemap = "#html"/>
<map name = "html">
<area id = "myarea" shape = "circle" coords = "154,150,59" href = "about.htm" alt = "Team" >
</map>
<script>
var x = document.getElementById("myid").useMap;
document.write("<br>Usemap: "+x);
</script>
</body>
</html>
코드 설명
document.getElementById("myid")로 id가 "myid"인 이미지 요소를 선택한 뒤, .useMap 프로퍼티에 접근하면 해당 이미지의 usemap 속성 값이 반환됩니다. 위 예제의 경우 #html이라는 값이 출력됩니다.
반환되는 값에는 항상 해시(#) 기호가 포함되며, 이는 같은 문서 내 <map> 태그의 name 속성과 연결됩니다. 이처럼 useMap 프로퍼티는 읽기뿐만 아니라 새로운 값을 할당하여 이미지 맵을 동적으로 변경하는 데에도 활용할 수 있습니다.