JS - images 객체

images 객체는 문서에 있는 <img> 형식의 모든 태그를 배열에 담습니다.

document.images.속성

다음의 속성을 사용할 수 있습니다.

메서드	설 명
images	<img> 태그에 있는 속성들의 배열 src: 이미지가 위치하는 경로 name: 이미지의 이름을 저장하고 있는 속성 align: 정렬 방식을 저장하고 있는 속성 border: 이미지의 테두리를 저장하고 있는 속성 width: 이미지의 너비 height: 이미지의 높이 vspace: 세로 여백을 저장하고 있는 속성 hspace: 가로 여백을 저장하고 있는 속성 complete: 이미지의 전송이 완료되었는지의 여부   true | false 중 하나를 저장하고 있는 속성 lowsrc: 저해상도 이미지를 사용할 경우 이미지의 URL   src 에 지정되어 있는 이미지가 완전히 로드될 때까지 보여줄 저해상도 이미지
new Image	Image 객체 생성자이며 다음 속성을 사용할 수 있습니다. width: 이미지의 가로 크기 height: 이미지의 세로 크기 Ex.) new Image( width, height );

images 객체는 <img> 태그이면 모두 해당이 됩니다.

<img src="example.jpg">
<img height="50">
<img src="example.jpg" align="center">
<a href="http://">하보니 php</a>
<img src="http://example.com" width="100" height="200" border="1">

<script>
var img = document.images;
for(var i = 0; i < img.length; i++) {
  document.write( img[i].src + " (" + img[i].height + ")<br/>");
}
/*
결과
  http://localhost:8080/example.jpg (0)
  (50)
  http://localhost:8080/example.jpg (0)
  http://example.com/ (200)
*/
</script>

다음은 image 객체 생성자에 대한 예제입니다.

<img id="user" src="no_img.jpg">
<script>
  var img = new Image(100, 100);
  img.src = 'aran.jpg';

  document.getElementById("user").src = img.src;
</script>