My Programing/HTML and JavaScript

JS :: Document 하위객체 Image

nkdk 2008. 6. 16. 10:05

  • image객체
    이미지를 처리합니다.

|형식| document.이미지명.속성;
|예제| document.myimage.border = 2;

|형식| document.images[인덱스번호].속성;
|예제| document.images[0].border = 2;

    • align : 이미지의 정렬방식을 설정하거나 반환합니다.
    • alt : 이미지의 설명을 설정하거나 반환합니다.
    • border : 이미지의 외곽선굵기를 설정하거나 반환합니다.
    • width : 이미지의 너비를 설정하거나 반환합니다.
    • height : 이미지의 높이를 설정하거나 반환합니다.
    • hspace : 이미지의 좌측여백값을 설정하거나 반환합니다.
    • vspace : 이미지의 상단여백값을 설정하거나 반환합니다.
    • lowsrc : 이미지파일의 위치를 설정/반환합니다. 해상도가 작은 파일로 이미지를 전송하는 동안에 보여줄 이미지파일을 말합니다.
    • name : 이미지이름을 설정하거나 반환합니다.
    • prototype : image객체의 속성을 추가하기 위해서 사용됩니다.
    • src : 이미지파일을 지정하거나 반환합니다.

image객체를 사용할 때는 document객체 다음에 이미지이름을 설정한 후에 속성을 사용합니다. 구분은 (.)을 이용합니다. 이미지가 두개 이상인 경우에는 images를 이용하여 배열식으로 처리할 수 있습니다. 첫번째 이미지가 [인덱스번호]가 0이 되고 두번째 이미지의 [인덱스번호]가 1이 됩니다. 이런 식으로 0부터 시작하여 1씩 증가하여 [인덱스번호]가 부여됩니다.

<html>
<body>

<img name="hijab" src="hijab.jpg" border=3 align="bottom" hspace=2 vspace=4  alt="히잡">
<img name="icon" src="ico_star.gif" border=3 align="bottom" alt="아이콘">
<hr>

<script language="JavaScript">
<!--
document.write("[01] 이미지 갯수 : "+ document.images.length, "<br>");
document.write("[02] 이미지 이름 : "+ document.hijab.name, "<br>");
document.write("[03] 이미지 URL : "+ document.hijab.src, "<br>");
document.write("[04] 이미지 너비 : "+ document.hijab.width, "<br>");
document.write("[05] 이미지 높이 : "+ document.hijab.height, "<br>");
document.write("[06] 이미지 너비 여백 : "+ document.hijab.hspace, "<br>");
document.write("[07] 이미지 높이 여백 : "+ document.hijab.vspace, "<br>");
document.write("[08] 이미지 정렬 상태 : "+ document.hijab.align, "<br>");
document.write("[09] 이미지 외곽선 굵기 : "+ document.hijab.border, "<br>");
document.write("[10] 이미지 설명 : "+ document.hijab.alt, "<br>");
// -->
</script>

</body>
</html>