img 개체를 만들거나 관리한다. 문서에 이미지나 비디오 클립(clip)을 엔베드(embed)한다.

Script imgObj=new Image([width,][height]);
[propVal=]..propName;
HTML propName="propVal">innerString
인수
imgObj : (이미지명)
이미지 개체의 이름으로 <IMG name="imgObj">에 해당한다.
width : (이미지 너비)
선택적인 요소이며, <IMG width="iVal"">에 해당에 해당하는 Image 개체의 너비를 픽셀단위로 나타낸다.
height : (이미지 높이)
선택적인 요소이며, <IMG height="iVal"">에 해당에 해당하는 Image 개체의 높이를 픽셀단위로 나타낸다.
생성

Image 개체는 HTML에서 <IMG> 태그로 생성된다. 

<IMG name="imgName" src="../../gif/rfobject.gif" border="1" width="50" height="18">

또한 new 연산자와 Image constructor를 사용하여 Javascript로 Image 개체를 생성할 수 있다.
이는 네트워크상에서 이미지를 로드하여 디스플레이 되기전에 캐쉬(cache)에 저장하는데 유용하다. 
imgObj=new Image([width,][height]);
imgObj.src='../../gif/rfobject.gif'

일단 생성된 Image 개체는 IMG 엘레멘트로 생성된 개체와 동일하다.
구성

문서상의 모든 이미지 개체는 배열변수 images에 등록되고 관리되며, document.images 속성으로 호출이 가능하다.

호출

images 컬렉션는 배열변수(Array)이므로 인수(index)를 통하여 Array 호출 규칙에 따라 호출될 수 있다.
HTML에서 <IMG name="imgName"> 태그로 이미지명이 부여되었으면, images 컬렉션에 등록되어 있어 이미지명으로도 호출될 수 있다. 

document.images[index]
document.images['imageID']

사용

Image 개체를 교체하여도 읽기 전용인 이미지의 너비(width)와 높이(height) 속성들은 변경되지 않고, <IMG> 태그 속에 지정된 값으로 디스플레이된다.

Javascript로 Image 개체의 src 속성값을 연속적으로 바꾸어 주면 애니메이션 효과도 구현할 수 있다.
그러나 개별 이미지 파일들이 로딩되어야하므로 한 파일로 로딩되는 GIF 애니메이션 그래픽처럼 빠르지는 못하다.


특기

input 개체가 초점을 받아도 이 엘레멘트에서는 MAP 엘레멘트와 연관되지 않았으면 onfocus 이벤트가 발생되지 않는다.

IE5는 다음의 이미지나 비디오 파일을 지원한다.

확장자설명명칭
.avi Audio-Visual Interleaved AVI
.bmp Windows Bitmap BMP
.emf Windows Enhanced Metafile EMF
.gif Graphics Interchange Format GIF
.jpg, .jpeg Joint Photographic Experts Group JPEG
.mov Apple QuickTime Movie MOV
.mpg, .mpeg Motion Picture Experts Group MPEG
.png Portable Network Graphics PNG
.wmf Windows Metafile WMF
.xbm X Bitmap XBM

IMG 엘레멘트로 고정 이미지를 디스플레이할 때는 파일의 주소(URL) 지정을 src 애트리뷰트로 한다.

IMG 엘레멘트로 비디오 조각이나 VRML(Virtual Reality Modeling Language)을 디스플레이할 때는 파일의 주소(URL) 지정을 dynsrc 애트리뷰트로 한다.

이 개체는 IE3.0에서 지원되고 스크립트는 IE4.0에서 부터 지원된다.

이 엘레멘트는 인라인 엘레멘트이다.

이 엘레멘트는 종료태그를 필요로 하지 않는다.

주기 : onclick, onmouseout, onmouseover 이벤트처리자는 IE에서는 사용되고 NS에서는 사용할 수 없으나, NS Image 개체에서 area 개체를 정의하거나 link 개체를 연계한 IMG를 사용하면, 이벤트처리자를 사용할 수 있다.
참조
input

이 개체는 (영문)HTML3.2에 정의되었고 (영문)DOM Level 1(W3C Document Object Model)에 정의되었다.



설명을 위한 예제

앞 형제 KBD 내용IMG 설명을 위한 예제뒤 형제 KBD 내용
HTML로 생성된 이미지
javascript로 생성한 이미지 개체 
<SCRIPT>
ojObj=new Image(80,24);
ojObj.src='../../gif/rfexample.gif';
ojObj.name='imgName';
ojObj.id='imgId';
ojObj.border=1;
ojObj.hspace=100;
ojObj.vspace=10;
ojObj.lowsrc='../../gif/rfproperty.gif';
ojObj.alt='javascript로 생성된 이미지';
document.write(ojObj.outerHTML);
</SCRIPT>
<INPUT type=button onClick="showAttribs(ojObj)" value="img 속성 상세">

컬렉션설명과 예제 코드결과참고
all 개체에 포함되어 있는 모든 엘레멘트들의 배열변수를 참조하고 반환한다.
<SCRIPT>document.write(oObj.all.length)</SCRIPT>
attributes 개체의 애트리뷰트(attribute 개체)들의 배열변수를 참조하고 반환한다.
<SCRIPT>document.write(oObj.attributes.length)</SCRIPT>
behaviorUrns 엘레멘트에 첨부된 비해이버(behavior)들을 인식하는 주소(URN) 문자열들의 배열변수를 참조하고 반환한다.
<SCRIPT>document.write(oObj.behaviorUrns.length)</SCRIPT>
childNodes 개체의 바로 종속된 자식들의 엘레멘트 개체들과 TextNode 개체들의 배열변수를 참조하고 반환한다.
<SCRIPT>document.write(oObj.childNodes.length)</SCRIPT>
children 개체의 바로 종속된 DHTML 개체들인 자식들의 배열변수를 참조하고 반환한다.
<SCRIPT>document.write(oObj.children.length)</SCRIPT>
filters 개체에 적용된 필터들의 배열변수인 컬렉션을 참조하고 반환한다.
<SCRIPT>document.write(oObj.filters.length)</SCRIPT>

개체설명결과
currentStyle 공통 스타일쉬트, 인라인 스타일 HTML 애트리뷰트등으로 지정한 개체의 카스케이딩 형식과 스타일들 참조한다.
<SCRIPT>document.write(oObj.currentStyle.color)</SCRIPT>
runtimeStyle 덮어 씌워진 최종 공통 스타일쉬트, 인라인 스타일 HTML 애트리뷰트등으로 지정한 개체의 카스케이딩 형식과 스타일들 참조한다.
<BUTTON onclick="oObj.runtimeStyle.borderColor='red'">적색으로</BUTTON>
단추를 클릭하고 예제의 색상을 확인하라.
style 개체의 현재 모든 가능한 인라인 스타일 설정들을 참조한다.
<SCRIPT>document.write(oObj.style.cssText.length))</SCRIPT>

accessKey 속성 IE NS (accesskey="chrVal"> 애트리뷰트)
⇒ 개체의 접속키를 지정하거나 지정한 접속키를 반환한다.
문법: .accessKey[=chrVal]
코드: document.write(oObj.accessKey='1') 결과:
align 속성 IE (align=sVal> 애트리뷰트)
⇒ 개체의 정렬 위치를 반환하거나 지정한다.
문법: .align[=sVal]
코드: document.write(oObj.align); 결과:
예제alt 속성 IE NS (alt="sVal"> 애트리뷰트)
⇒ 개체의 지정된 대체문자열(규격 alt) 문자열을 반환하거나 지정한다.
문법: .alt[=sVal]
코드: document.write(oObj.alt) 결과:
Script 없슴 atomicselection="bVal"> 애트리뷰트)
⇒ 엘레멘트와 그 내용이 전체적으로 선택되어야 하는가 개별적으로 선택될 수 있는가를 지정한다.
begin 속성 IE (begin="tVal"> 애트리뷰트)
⇒ 개체를 플레이하는데 시작되는 지연시간을 반환하거나 지정한다.
문법: .begin[=sVal]
코드: document.write(oObj.begin); 결과:
예제border 속성 IE NS3 (border="iVal"> 애트리뷰트)
⇒ 선언된 이미지의 테두리 두께를 픽셀 단위로 수치를 반환하거나 지정한다.
Image constructor로 생성한 경우는 이 값은 0이다.
문법: .border[=sVal]
코드: document.write(oObj.border) 결과:
canHaveHTML 속성 IE
⇒ 개체가 HTML 태그들을 가질 수 있는가를 부울값으로 반환한다.
문법: [bVal=].canHaveHTML
코드: document.write(oObj.canHaveHTML); 결과:
className 속성 IE (class="sVal"> 애트리뷰트)
⇒ 개체의 클라스 이름을 반환하거나 설정한다.
문법: .className[=sVal]
코드: document.write(oObj.className); 결과:
clientHeight 속성 IE
⇒ 블럭 개체의 높이를 픽셀단위로 반환한다.
문법: [iVal=].clientHeight
코드: document.write(oObj.clientHeight); 결과:
clientLeft 속성 IE
⇒ offsetLeft 속성과 실제적인 사용자 지역의 왼쪽 모서리와의 거리를 픽셀단위로 반환한다.
문법: [iVal=].clientLeft
코드: document.write(oObj.clientLeft); 결과:
clientTop 속성 IE
⇒ offsetTop 속성과 실제적인 사용자 지역의 위쪽 모서리와의 거리를 픽셀단위로 반환한다.
문법: [iVal=].clientTop
코드: document.write(oObj.clientTop); 결과:
clientWidth 속성 IE
⇒ 블럭 개체의 너비를 픽셀단위로 반환한다.
문법: [iVal=].clientWidth
코드: document.write(oObj.clientWidth); 결과:
예제complete 속성 IE NS3
⇒ 읽기 전용으로 브라우져가 이미지 로딩을 완료하였는지를 부울(Boolean)값으로 반환한다.
문법: [bVal=].complete
코드: document.write(oObj.complete) 결과: 예제의 결과가 false로 나타나더라도 이미지 로딩이 완료된 상태에서는 true가 된다.
코드: <BUTTON onclick="alert(oObj.complete)">예제 클릭</BUTTON> 결과:
constructor 속성 - NS3
⇒ 이메지 구성자를 반환한다.
문법: .constructor[=sVal]
코드: document.write(ojObj.constructor)
dataFld 속성 IE (datafld="sVal"> 애트리뷰트)
⇒ 개체의 dataSrc 속성과 같은 개체에 연결된 데이터 원천을 반환하거나 지정한다.
문법: .dataFld[=sVal]
코드: document.write(oObj.dataFld); 결과:
dataSrc 속성 IE (datasrc="urlVal"> 애트리뷰트)
⇒ 개체에 연결된 데이터의 원천을 반환하거나 지정한다.
문법: .dataSrc[=urlVal]
코드: document.write(oObj.dataSrc); 결과:
dir 속성 IE (dir="ltr"|"rtl"> 애트리뷰트)
⇒ 개체의 내용 읽는 순서를 문자열로 반환하거나 설정한다.
문법: .dir[=sVal]
코드: document.write(oObj.dir); 결과:
disabled 속성 IE (disabled[=true|false]> 애트리뷰트)
⇒ 사용자가 개체에서 작업할 수 있는가를 부울값으로 반환하거나 설정한다.
문법: .disabled[=true|false]
코드: document.write(oObj.disabled); 결과:
dynsrc 속성 IE NS(dynsrc="urlVal> 애트리뷰트)
⇒ 윈도우에 디스플레이될 비디오나 VRML을 반환하거나 지정한다.
문법: .dynsrc[=urlVal]
코드: document.write(oObj.dynsrc) 결과:
end 속성 IE (end="tVal"> 애트리뷰트)
⇒ 개체가 반복 플레이 중 한회가 완료되었던가, 전부 완료되었는가의 값을 반환하거나 설정한다.
문법: .end[=sVal]
코드: document.write(oObj.end); 결과:
fileCreatedDate 속성 IE4 -
⇒ 읽기 전용으로 지정된 document 개체의 파일 생성일자를 반환한다.
문법: .fileCreatedDate
코드: document.write(oObj.fileCreatedDate); 결과:
fileModifiedDate 속성 IE4 -
⇒ 읽기 전용으로 지정된 document 개체의 파일 최종 수정일자를 반환한다.
문법: .fileModifiedDate
코드: document.write(oObj.fileModifiedDate); 결과:
fileSize 속성 IE4 -
⇒ 읽기 전용으로 지정된 document 개체의 파일 크기를 반환한다.
문법: .fileSize
코드: document.write(oObj.fileSize); 결과:
fileUpdatedDate 속성 IE4 -
⇒ 읽기 전용으로 파일의 마지막 업데이트된 일자를 반환한다.
문법: .fileUpdatedDate
코드: document.write(oObj.fileUpdatedDate); 결과:
firstChild 속성 IE
⇒ 개체의 childNodes 컬렉션에서 제일 먼저 자식 개체을 반환한다.
문법: [oVal=].firstChild
코드: document.write(oObj.firstChild); 결과:
코드: if (oObj.firstChild) document.write(oObj.firstChild.nodeName); 결과:
galleryImg 속성 IE6 (galleryImg="bVal"> 애트리뷰트)
⇒ 현재의 이미지 개체에서 'My Pictures' 이미지툴이 보이는가를 부울값으로 반환하거나 설정한다.
문법: .galleryImg[=true|false]
코드: document.write(oObj.galleryImg); 결과:
hasMedia 속성 IE
⇒ 개체을 개체가 HTML+time 메디어 엘레멘트인가의 부울값을 반환한다.
문법: [oVal=].hasMedia
코드: document.write(oObj.hasMedia); 결과:
예제height 속성 IE NS3 (height="iVal"> 애트리뷰트)
⇒ 선언된 이미지의 높이를 픽셀 단위로 수치를 반환한다.
Image constructor로 생성한 경우는 이미지 너비는 자체이므로 값이 디프플레이될 수 없어 이 값은 null이다.
문법: .height[=iVal]
코드: document.write(oObj.height) 결과:
코드: document.write(ojObj.height) 결과:
hideFocus 속성 IE (hidefocus=true|false> 애트리뷰트)
⇒ 개체가 초점을 받지았는지 시각적으로 인식할 수 있는 부울값으로 반환하거나 설정한다.
문법: .hideFocus[=true|false]
코드: document.write(oObj.hideFocus); 결과:
예제hspace 속성 IE NS3(hspace="iVal"> 애트리뷰트)
⇒ 선언된 이미지의 왼쪽과 오른쪽 테두리사이의 거리를 픽셀 단위로 수치를 반환하거나 지정한다.
Image constructor로 생성한 경우는 이미지 높이는 자체이므로 값이 디프플레이될 수 없어 이 값은 null이다.
문법: .hspace[=iVal]
코드: document.write(oObj.hspace) 결과:
id 속성 IE (id=idString> 애트리뷰트)
⇒ 개체를 대표하는 인식자 문자열을 반환하거나 지정한다.
문법: .id[=sVal]
코드: document.write(oObj.id); 결과:
images(컬렉션) 속성 IE4 NS3
⇒ 문서의 Image 개체들의 배열변수 images 컬렉션을 반환한다.
문법: [cVal=]document.images.length
코드: document.write(document.images) 결과:
코드: document.write(document.images.length) 결과:
예제lowsrc 속성 IE NS3 (lowsrc="sVal"> 애트리뷰트)
⇒ 선언된 이미지의 저해상도(low-resolution) 버전의 주소를 참조한다. 브라우저는 저해상도 버전을 먼저 로딩하고 의 src 속성으로 지정된 본래의 이미지를 로딩하여 대체한다. src 속성은 Javascript로 변경시킬 수 있다.
문법: .lowsrc[=sVal]
코드: document.write(oObj.lowsrc) 결과:
이미지 화일이 큰 경우 사용되는데 예제에서는 다른 이미지 주소를 넣어 보았다.
isContentEditable 속성 IE
⇒ 사용자가 개체의 내용을 편집할 수 있는가를 부울값으로 반환한다.
문법: [bVal=].isContentEditable
코드: document.write(oObj.isContentEditable); 결과:
isDisabled 속성 IE
⇒ 개체가 불활성화 되었는가를 부울값으로 반환한다.
문법: [bVal=].isDisabled
코드: document.write(oObj.isDisabled); 결과:
isMap 속성 IE (isMap=bVal> 애트리뷰트)
⇒ 이미지 개체가 서버측 이미지맵인가를 나타내는 부울값을 반환하거나 지정한다.
문법: .isMap[=bVal]
코드: document.write(oObj.isMap); 결과:
isMultiLine 속성 IE
⇒ 개체가 여러줄로 되어있는가를 부울값으로 반환한다.
문법: [bVal=].isMultiLine
코드: document.write(oObj.isMultiLine); 결과:
isTextEdit 속성 IE
⇒ 개체속에서 TextRange 개체를 생성할수 있는가를 부울값으로 반환한다.
문법: [bVal=].isTextEdit
코드: document.write(oObj.isTextEdit); 결과:
lang 속성 IE (lang="sVal"> 애트리뷰트)
⇒ 개체에서 사용한 언어코드를 반환하거나 설정한다.
문법: .lang[=sVal]
코드: document.write(oObj.lang); 결과:
language 속성 IE (language="sVal"> 애트리뷰트)
⇒ 개체에서 사용한 스크립트 언어를 반환하거나 설정한다.
문법: .language[=sVal]
코드: document.write(oObj.language); 결과:
lastChild 속성 IE
⇒ 개체의 childNodes 컬렉션에서 마지막 자식 개체을 반환한다.
문법: [oVal=].lastChild
코드: document.write(oObj.lastChild; 결과:
코드: if (oObj.lastChild) document.write(oObj.lastChild.innerText); 결과:
longDesc 속성 IE6
⇒ 개체의 주소(URI)에 대한 긴 설명을 반환하거나 설정한다.
문법: .longDesc[=sVal]
코드: document.write(oObj.longDesc; 결과:
loop 속성 IE (loop=Val> 애트리뷰트)
⇒ 음악이나 비디오 플레이를 몇번 반복할 것인가를 반환하거나 지정한다.
문법: .loop[=Val]
코드: document.write(oObj.loop); 결과:
lowsrc 속성 IE NS (lowsrc="sVal"> 애트리뷰트)
⇒ 디스플레이될 저해상도 이미지를 반환하거나 지정한다.
문법: .lowsrc[=sVal]
코드: document.write(oObj.lowsrc) 결과:
예제name 속성 IE NS3 (name="sVal"> 애트리뷰트)
⇒ 선언된 Image 개체의 이름을 반환하거나 지정한다.
Image constructor로 생성한 경우는 이 값은 null이다.
문법: .name[=sVal]
코드: document.write(oObj.name) 결과:
href 속성 IE (href=Val> 애트리뷰트)
⇒ 개체의 목표나 연결 포인트의 주소를 반환하거나 설정한다.
문법: [sVal=].href
코드: document.write(oObj.href); 결과:
nextSibling 속성 IE
⇒ 개체의 다음 형제(같은 모체의 다음 자식) 개체을 반환한다.
문법: [oVal=].nextSibling
코드: document.write(oObj.nextSibling); 결과:
코드: if (oObj.nextSibling) document.write(oObj.nextSibling.innerText); 결과:
nodeName 속성 IE
⇒ 개체의 특정 노드(node) 타입 이름을 반환한다.
문법: [sVal=].nodeName
코드: document.write(oObj.nodeName); 결과:
nodeType 속성 IE
⇒ 개체의 특정 노드(node)의 종류를 반환한다.
문법: [sVal=].nodeType
코드: document.write(oObj.nodeType); 결과:
nodeValue 속성 IE
⇒ 개체의 특정 노드(node)의 값을 반환한다.
문법: [oVal=].nodeValue
코드: document.write(oObj.nodeValue); 결과:
offsetHeight 속성 IE
⇒ offsetParent에 설정에따라 모체의 레이아웃이나 좌표에 상대적으로 계산된 높이 위치를 픽셀단위로 반환한다.
문법: [iVal=].offsetHeight
코드: document.write(oObj.offsetHeight); 결과:
offsetLeft 속성 IE
⇒ offsetParent에 설정에따라 모체의 레이아웃이나 좌표에 상대적으로 계산된 수평 위치를 픽셀단위로 반환한다.
문법: [iVal=].offsetLeft
코드: document.write(oObj.offsetLeft); 결과:
offsetParent 속성 IE
⇒ 개체에 offsetParent과 offsetLeft 속성들이 지정된 용기 개체를 참조하고 반환한다.
문법: [oVal=].offsetParent
코드: document.write(oObj.offsetParent); 결과:
코드: document.write(oObj.offsetParent.nodeName); 결과:
offsetTop 속성 IE
⇒ offsetParent에 설정에따라 모체의 레이아웃이나 좌표에 상대적으로 계산된 수직 위치를 픽셀단위로 반환한다.
문법: [iVal=].offsetTop
코드: document.write(oObj.offsetTop); 결과:
offsetWidth 속성 IE
⇒ offsetParent에 설정에따라 모체의 레이아웃이나 좌표에 상대적으로 계산된 너비 위치를 픽셀단위로 반환한다.
문법: [iVal=].offsetWidth
코드: document.write(oObj.offsetWidth); 결과:
onOffBehavior 속성 IE
⇒ 지정된 MS DirectAnimation® 비헤이버(behavior)가 돌아가는지를 나타내는 개체를 반환한다.
문법: .onOffBehavior[=true|false]
코드: document.write(oObj.onOffBehavior=true); 결과:
outerHTML 속성 IE
⇒ 개체와 개체의 외부 내용을 HTML로 반환한다.
문법: [sVal=].outerHTML
코드: document.write(oObj.outerHTML.length); 결과:
outerText 속성 IE
⇒ 개체와 개체의 외부 내용을 텍스트로 반환한다.
문법: [sVal=].outerText
코드: document.write(oObj.outerText); 결과:
ownerDocument 속성 IE6
⇒ 노드(node)에 연관한 document 개체를 반환하거나 설정한다.
문법: .ownerDocument[=oVal]
코드: document.write(oObj.ownerDocument); 결과:
코드: document.write(oObj.ownerDocument.nodeName); 결과:
parentElement 속성 IE
⇒ 체계 구조상 부모 엘레멘트 개체를 반환한다.
문법: [oVal=].parentElement
코드: document.write(oObj.parentElement); 결과:
코드: document.write(oObj.parentElement.nodeName); 결과:
parentNode 속성 IE
⇒ 구조상 부모 엘레멘트 개체를 반환한다.
문법: [oVal=].parentNode
코드: document.write(oObj.parentNode); 결과:
코드: document.write(oObj.parentNode.nodeName); 결과:
parentTextEdit 속성 IE
⇒ 구조상 원본 개체를 포함하고 있는 용기 개체속에서 TextRange 개체를 생성할 수 있는 용기 개체를 반환한다.
문법: [oVal=].parentTextEdit
코드: document.write(oObj.parentTextEdit); 결과:
previousSibling 속성 IE
⇒ 개체의 다음 형제(같은 모체의 다음 자식) 개체을 반환한다.
문법: [oVal=].previousSibling
코드: document.write(oObj.previousSibling); 결과:
코드: if (oObj.previousSibling) document.write(oObj.previousSibling.nodeName); 결과:
protocol 속성 IE
⇒ 주소(URL)에 연관된 프로토콜(protocol) 번호를 반환하거나 설정한다.
문법: .protocol[=sVal]
코드: document.write(oObj.protocol); 결과:
readyState 속성 IE
⇒ 개체의 현재 상태를 반환한다.
문법: [sVal=].readyState
코드: document.write(oObj.readyState); 결과:
코드: <SPAN id=SwRS></SPAN>&nbsp;<BUTTON onclick="SwRS.innerText=oObj.readyState">클릭</BUTTON> 결과:  
recordNumber 속성 IE
⇒ 개체가 생성한 리코드 순서 번호를 반환한다.
문법: [iVal=].recordNumber
코드: document.write(oObj.recordNumber); 결과:
scopeName 속성 IE
⇒ 엘레멘트 개체를 위해 정의된 namespace를 반환한다.
문법: [sVal=].scopeName
코드: document.write(oObj.scopeName); 결과:
scrollHeight 속성 IE
⇒ 개체의 스크롤(화면굴림) 높이를 반환한다.
문법: [iVal=].scrollHeight
코드: document.write(oObj.scrollHeight); 결과:
scrollLeft 속성 IE
⇒ 개체의 왼쪽 모서리와 현재 윈도우의 내용이 보이는 가장 왼쪽 위치와의 거리를 픽셀단위로 반환하거나 설정한다.
문법: [iVal=].scrollLeft
코드: document.write(oObj.scrollLeft); 결과:
scrollTop 속성 IE
⇒ 개체의 위쪽 모서리와 현재 윈도우의 내용이 보이는 가장 위쪽 위치와의 거리를 픽셀단위로 반환하거나 설정한다.
문법: [iVal=].scrollTop
코드: document.write(oObj.scrollTop); 결과:
scrollWidth 속성 IE
⇒ 개체의 스크롤(화면굴림) 너비를 반환한다.
문법: [iVal=].scrollWidth
코드: document.write(oObj.scrollWidth); 결과:
sourceIndex 속성 IE
⇒ 소스 순서에서 문서의 all 컬렉션에 나타나는 개체의 위치를 반환한다.
문법: [iVal=].sourceIndex
코드: document.write(oObj.sourceIndex); 결과:
코드: document.write(document.all(oObj.sourceIndex).nodeName); 결과:
예제src 속성 IE NS3 (src="sVal"> 애트리뷰트)
⇒ 선언된 Image 개체의 주소를 문자열을 참조한다. src 속성은 Javascript로 변경시킬 수 있으나 새로운 이미지도 원래의 크기(높이와 너비)를 갖는다. 또한 lowsrc 속성도 달라져서 무시되므로 먼저 lowsrc 속성을 변경시키고 src 속성을 변경시켜야 한다.
문법: .src[=urlVal]
코드: document.write(oObj.src) 결과:
start 속성 IE NS (start="sVal"> 애트리뷰트)
⇒ 비디오가 언제 플레이될 것인가를 나타내는 문자을 반환하거나 지정한다.
문법: .start[=sVal]
코드: document.write(oObj.start) 결과:
style 속성 IE (style="cssVal"> 애트리뷰트)
⇒ 엘레멘트의 인라인 스타일을 반환하거나 설정한다.
문법: .style[=cssVal]
코드: document.write(oObj.style.cssText); 결과:
syncMaster 속성 IE (syncMaster="bVal"> 애트리뷰트)
⇒ 시간용기가 이 개체의 플레이와 동기화해야 하는가를 반환하거나 설정한다.
문법: .syncMaster[=bVal]
코드: document.write(oObj.syncMaster=false); 결과:
systemBitrate 속성 IE (systemBitrate="speedVal"> 애트리뷰트)
⇒ 시스템의 대략적 밴드폭을 bps(bits-per-second) 단위로 반환한다.
문법: [sVal=].systemBitrate
코드: document.write(oObj.systemBitrate); 결과:
systemCaptions 속성 IE (systemCaptions="sVal"> 애트리뷰트)
⇒ 디스플레이되는 텍스트가 플레이되는 오디오 부분에 해당하는가를 나타내는 값을 반환한다.
문법: [sVal=].systemCaptions
코드: document.write(oObj.systemCaptions); 결과:
systemLanguage 속성 IE (systemLanguage="sVal"> 애트리뷰트)
⇒ 사용자가 시스템에 설정한 선호 언어를 반환한다.
문법: [sVal=].systemLanguage
코드: document.write(oObj.systemLanguage); 결과:
systemOverdubOrSubtitle 속성 IE (systemOverdubOrSubtitle="sVal"> 애트리뷰트)
⇒ 개체를 플레이할 때 작은 제목들을 표현할 것인가를 반환한다.
문법: .systemOverdubOrSubtitle[=sVal]
코드: document.write(oObj.systemOverdubOrSubtitle='overdub'); 결과:
tabIndex 속성 IE (tabindex="iVal"> 애트리뷰트)
⇒ 개체의 탭(tab)에 의한 항해에 사용되는 순서를 반환하거나 설정한다.
문법: [iVal=].tabIndex
코드: document.write(oObj.tabIndex); 결과:
tagName 속성 IE
⇒ 개체의 태그(tag) 이름을 반환한다.
문법: [sVal=].tagName
코드: document.write(oObj.tagName); 결과:
tagUrn 속성 IE
⇒ 개체의 namespace 선언에서 설정된 주소(URN: Uniform Resource Name)를 반환하거나 설정한다.
문법: .tagUrn[=sVal]
코드: document.write(oObj.tagUrn); 결과:
timeContainer 속성 IE (timecontainer="sVal"> 애트리뷰트)
⇒ 개체와 연관된 타임라인의 형식을 반환하거나 설정한다.
문법: .timeContainer[=sVal]
코드: document.write(oObj.timeContainer); 결과:
title 속성 IE (title="sVal"> 애트리뷰트)
⇒ 개체의 참고적인 제목을 반환하거나 설정한다.
문법: .title[=sVal]
코드: document.write(oObj.title); 결과:
uniqueID 속성 IE
⇒ 자동적으로 생성된 개체의 유일한 인식자 문자열을 반환한다.
문법: [sVal=].uniqueID
코드: document.write(oObj.uniqueID); 결과:
Script 없슴 unselectable="on|off"> 애트리뷰트)
⇒ 엘레멘트가 선택될 수 없음을 설정한다.
useMap 속성 IE (useMap="sVal"> 애트리뷰트)
⇒ 자주 북마크 확장자(#name)와 함께 사용자측 이미지맵으로 사용하기 위한 주소을 반환하거나 설정한다.
문법: .useMap[=sVal]
코드: document.write(oObj.useMap); 결과:
예제vspace 속성 IE NS3 (vspace="iVal"> 애트리뷰트)
⇒ 선언된 이미지의 윗쪽과 아래쪽 테두리사이의 거리를 픽셀 단위로 수치를 반환하거나 지정한다.
Image constructor로 생성한 경우는 이 값은 null이다.
문법: .vspace[=iVal]
코드: document.write(oObj.vspace) 결과:
코드: document.write(ojObj.vspace) 결과:
예제width 속성 - NS3 (width="iVal"> 애트리뷰트)
⇒ 선언된 이미지의 너비를 픽셀 단위로 수치를 반환하거나 지정한다.
Image constructor로 생성한 경우는 이미지 너비는 자체이므로 값이 디프플레이될 수 없어 이 값은 null이다.
문법: .width[=iVal]
코드: document.write(oObj.width) 결과:
코드: document.write(ojObj.width) 결과:
x / y 속성 - NS3 (x="iVal">, y="iVal"> 애트리뷰트)
⇒ 이메지 좌표를를 반환히거나 지정한다.
문법: .x[=iVal]
문법: .y[=iVal]
코드: document.write(oObj.x,' ',oObj.y)

stylescript
{background:val} obj.style.background[=val]
⇒ 개체의 배경 속성들을 5개까지 반환하거나 설정한다.
{background-attachment:val} obj.style.backgroundAttachment[=val]
⇒ 문서 속의 배경 이미지를 개체에 배열 방식을 반환하거나 설정한다.
{background-color:val} obj.style.backgroundColor[=val]
⇒ 개체의 배경에 깔리는 색상을 반환하거나 설정한다.
{background-image:val} obj.style.backgroundImage[=val]
⇒ 개체의 배경 이미지를 반환하거나 설정한다 .
{background-position:val} obj.style.backgroundPosition[=val]
⇒ 개체의 배경 이미지의 위치를 반환하거나 설정한다.
{background-position-x:val} obj.style.backgroundPositionX[=val]
⇒ backgroundPosition 속성의 x 좌표를 반환하거나 설정한다.
{background-position-y:val} obj.style.backgroundPositionY[=val]
⇒ backgroundPosition 속성의 y 좌표를 반환하거나 설정한다.
{background-repeat:val} obj.style.backgroundRepeat[=val]
⇒ 개체 backgroundImage 속성의 반복 방식을 반환하거나 설정한다.
{behavior:val} obj.style.behavior[=val]
⇒ DHTML behavior의 소개 위치를 반환하거나 설정한다.
{border:val} obj.style.border[=val]
⇒ 개체의 테두리 속성들을 일괄적으로 반환하거나 설정한다.
{border-bottom:val} obj.style.borderBottom[=val]
⇒ 개체의 바닥 테두리 속성들을 반환하거나 설정한다.
{border-bottom-color:val} obj.style.borderBottomColor[=val]
⇒ 개체의 바닥 테두리의 색상을 반환하거나 설정한다.
{border-bottom-style:val} obj.style.borderBottomStyle[=val]
⇒ 개체의 바닥 테두리 형태를 반환하거나 설정한다.
{border-bottom-width:val} obj.style.borderBottomWidth[=val]
⇒ 개체의 바닥 테두리의 두께를 반환하거나 설정한다.
{border-color:val} obj.style.borderColor[=val]
⇒ 개체의 테두리 색상들을 반환하거나 설정한다.
{border-left:val} obj.style.borderLeft[=val]
⇒ 개체 왼쪽 테두리의 속성들을 반환하거나 설정한다.
{border-left-color:val} obj.style.borderLeftColor[=val]
⇒ 개체 왼쪽 테두리의 색상을 반환하거나 설정한다.
{border-left-style:val} obj.style.borderLeftStyle[=val]
⇒ 개체 왼쪽 테두리의 형태를 반환하거나 설정한다.
{border-left-width:val} obj.style.borderLeftWidth[=val]
⇒개체 왼쪽 테두리의 두께를 반환하거나 설정한다.
{border-right:val} obj.style.borderRight[=val]
⇒ 개체 오른쪽 테두리의 속성들을 반환하거나 설정한다.
{border-right-color:val} obj.style.borderRightColor[=val]
⇒ 개체 오른쪽 테두리의 색상을 반환하거나 설정한다.
{border-right-style:val} obj.style.borderRightStyle[=val]
⇒ 개체 오른쪽 테두리의 형태를 반환하거나 설정한다.
{border-right-width:val} obj.style.borderRightWidth[=val]
⇒ 개체 오른쪽 테두리의 두께를 반환하거나 설정한다.
{border-style:val} obj.style.borderStyle[=val]
⇒ 개체의 위쪽, 오른쪽, 아래쪽, 왼쪽 테두리들의 형태를 일괄적으로 반환하거나 설정한다.
{border-top:val} obj.style.borderTop[=val]
⇒ 개체 위쪽 테두리의 속성들을 반환하거나 설정한다.
{border-top-color:val} obj.style.borderTopColor[=val]
⇒ 개체 위쪽 테두리의 색상을 반환하거나 설정한다.
{border-top-style:val} obj.style.borderTopStyle[=val]
⇒ 개체 위쪽 테두리의 형태를 반환하거나 설정한다.
{border-top-width:val} obj.style.borderTopWidth[=val]
⇒ 개체 위쪽 테두리의 두께를 반환하거나 설정한다.
{border-width:val} obj.style.borderWidth[=val]
⇒ 개체의 위쪽, 오른쪽, 아래쪽, 왼쪽 테두리들의 두께를 일괄적으로 반환하거나 설정한다.
{bottom:val} obj.style.bottom[=val]
⇒ 개체 체계도상 아래쪽 개체와의 거리를 반환하거나 설정한다.
{clear:val} obj.style.clear[=val]
⇒ 개체에서 부동(float)부분의 면의 왼쪽, 오른쪽 혹은 양쪽으로 표현이 허용하는가를 반환하거나 설정한다.
{clip:val} obj.style.clip[=val]
⇒ 개체의 어느 부분을 보이게 할 것인가를 반환하거나 설정한다.
{cursor:val} obj.style.cursor[=val]
⇒ 개체위에서 마우스 포인터의 보이는 형태를 반환하거나 설정한다.
{direction:val} obj.style.direction[=val]
⇒ 개체의 읽는 순서를 반환하거나 설정한다.
{display:val} obj.style.display[=val]
⇒ 개체를 디스플레이할 것인가를 반환하거나 설정한다.
{filter:val} obj.style.filter[=val]
⇒ 개체에 적용되는 필터들의 컬렉션(filters)을 반환하거나 설정한다.
{font:val} obj.style.font[=val]
⇒ 개체의 font 속성들 조합하여 반환하거나 설정하거나, 사용자 선호 글꼴들을 6개까지 반환하거나 설정한다.
{font-family:val} obj.style.fontFamily[=val]
⇒ 사용한 글꼴의 이름들을 반환하거나 설정한다.
{font-style:val} obj.style.fontStyle[=val]
⇒ 개체의 글꼴 형태을 italic, normal, oblique등으로 반환하거나 설정한다.
{font-variant:val} obj.style.fontVariant[=val]
⇒ 개체의 문자를 작은 대문자들로 변형할 것인가를 반환하거나 설정한다.
{font-weight:val} obj.style.fontWeight[=val]
⇒ 개체의 글꼴 두께를 반환하거나 설정한다.
없슴 obj.style.hasLayout
⇒ 개체가 레이아웃(layout)을 가지고 있는가를 부울값으로 반환한다.
{height:val} obj.style.height[=val]
⇒ 개체의 높이를 반환하거나 설정한다.
{layout-grid:val} obj.style.layoutGrid[=val]
⇒ 문자들의 레이아웃을 지정하는 문서 그리드(grid) 속성들을 일괄적으로 반환하거나 설정한다.
{layout-grid-mode:val} obj.style.layoutGridMode[=val]
⇒ 텍스트 레이아웃 그리드에 가로, 세로가 사용되었는가를 반환하거나 설정한다
{left:val} obj.style.left[=val]
⇒ 개체 체계도상 왼쪽 개체와의 거리를 반환하거나 설정한다..
{letter-spacing:val} obj.style.letterSpacing[=val]
⇒ 개체 속에서 글자들 사이의 간격을 반환하거나 설정한다.
{line-height:val} obj.style.lineHeight[=val]
⇒ 개체 속에서 줄과 아래줄과의 거리를 반환하거나 설정한다.
{margin:val} obj.style.margin[=val]
⇒ 개체의 위쪽, 오른쪽, 아래쪽, 왼쪽 마진(주변 개체와의 간격)들의 두께를 일괄적으로 반환하거나 설정한다.
{margin-bottom:val} obj.style.marginBottom[=val]
⇒ 개체의 아래쪽 마진 두께을 반환하거나 설정한다.
{margin-left:val} obj.style.marginLeft[=val]
⇒ 개체의 왼쪽 마진 두께을 반환하거나 설정한다.
{margin-right:val} obj.style.marginRight[=val]
⇒ 개체의 오른쪽 마진 두께을 반환하거나 설정한다.
{margin-top:val} obj.style.marginTop[=val]
⇒ 개체의 위쪽 마진 두께을 반환하거나 설정한다.
{padding:val} obj.style.padding[=val]
⇒ 개체들 사이, 그들에 소속된 마진, 보더까지의 간격을 반환하거나 설정한다.
{padding-bottom:val} obj.style.paddingBottom[=val]
⇒ 개체의 아래쪽 보더와 내용 사이의 간격을 반환하거나 설정한다.
{padding-left:val} obj.style.paddingLeft[=val]
⇒ 개체의 왼쪽 보더와 내용 사이의 간격을 반환하거나 설정한다.
{padding-right:val} obj.style.paddingRight[=val]
⇒ 개체의 오른쪽 보더와 내용 사이의 간격을 반환하거나 설정한다.
{padding-top:val} obj.style.paddingTop[=val]
⇒ 개체의 위쪽 보더와 내용 사이의 간격을 반환하거나 설정한다.
없슴 obj.style.pixelBottom[=val]
⇒ 개체의 아래쪽 위치를 픽셀단위로 반환하거나 설정한다.
없슴 obj.style.pixelHeight[=val]
⇒ 개체의 높이를 픽셀단위로 반환하거나 설정한다.
없슴 obj.style.pixelLeft[=val]
⇒ 개체의 왼쪽 위치를 픽셀단위로 반환하거나 설정한다.
없슴 obj.style.pixelRight[=val]
⇒ 개체의 오른쪽 위치를 픽셀단위로 반환하거나 설정한다.
없슴 obj.style.pixelTop[=val]
⇒ 개체의 위쪽 위치를 픽셀단위로 반환하거나 설정한다.
없슴 obj.style.pixelWidth[=val]
⇒ 개체의 너비를 픽셀단위로 반환하거나 설정한다.
없슴 obj.style.posBottom[=val]
⇒ bottom 애트리뷰트로 지정된 단위로 개체의 아래쪽 위치를 반환하거나 설정한다.
없슴 obj.style.posHeight[=val]
⇒ height 애트리뷰트로 지정된 단위로 개체의 높이를 반환하거나 설정한다.
{position:val} obj.style.position[=val]
⇒ 개체의 위치시킴 방식을 반환하거나 설정한다.
없슴 obj.style.posLeft[=val]
⇒ left 애트리뷰트로 지정된 단위로 개체의 왼쪽 위치를 반환하거나 설정한다.
없슴 obj.style.posRight[=val]
⇒ right 애트리뷰트로 지정된 단위로 개체의 오른쪽 위치를 반환하거나 설정한다.
없슴 obj.style.posTop[=val]
⇒ top 애트리뷰트로 지정된 단위로 개체의 위쪽 위치를 반환하거나 설정한다.
없슴 obj.style.posWidth[=val]
⇒ width 애트리뷰트로 지정된 단위로 개체의 너비를 반환하거나 설정한다.
{right:val} obj.style.right[=val]
⇒ 개체 체계도상 오른쪽 개체와의 거리를 반환하거나 설정한다.
{float:val} obj.style.styleFloat[=val]
⇒ 개체에서 어느 방향으로 텍스트가 흐를 것인가를 반환하거나 설정한다.
{text-autospace:val} obj.style.textAutospace[=val]
⇒ 조정된 문자를 위한 자동 문자 간격 맞추기를 반환하거나 설정한다.
{text-underline-position:val} obj.style.textUnderlinePosition[=val]
⇒ 개체의 textDecoration 속성이 'underline'로 설정된 경우 밑줄의 위치를 반환하거나 설정한다.
{top:val} obj.style.top[=val]
⇒ 개체 체계도 상 바로위의 개체로부터의 거리를 반환하거나 설정한다.
{unicode-bidi:val} obj.style.unicodeBidi[=val]
⇒ 양방향 알고리즘에 관한 깔린 수준을 반환하거나 설정한다.
{vertical-align:val} obj.style.verticalAlign[=val]
⇒ 개체의 수직 정렬 방식을 반환하거나 설정한다.
{visibility:val} obj.style.visibility[=val]
⇒ 개체의 내용이 디스플레이될 것인가를반환하거나 설정한다.
{word-spacing:val} obj.style.wordSpacing[=val]
⇒ 개체 속에서 단어간의 간격을 증가시키는 정도를 반환하거나 설정한다.
{word-wrap:val} obj.style.wordWrap[=val]
⇒ 내용이 용기 개체의 범위를 초과하면 단어를 자를 것인가를 반환하거나 설정한다.
{zoom:val} obj.style.zoom[=val]
⇒ 개체의 확대 배율을 반환하거나 설정한다.

필터 속성설명
Alpha 개체 내용의 명도(opacity)를 조정한다.
AlphaImageLoader 개체의 테두리 속에서 잘라내기나 이미지의 크기를 조정할 수 있으며, 내용과 배경 사이에 디스플레이 된다.
Barn 미닫이 문을 닫고 여는 것과 유사한 움직임으로 개체의 내용을 새로이 표시한다.
BasicImage 개체 내용을 색상을 처리하거나, 이미지를 회전시키거나, 선명도를 조정한다.
BlendTrans 개체의 원본 내용을 점진적으로 변화시켜 새로운 내용으로 표현한다.
Blinds 개체의 원본 내용을 브라인드를 열고 닫는 것처럼 점진적으로 변화시켜 새로운 내용으로 표현한다.
Blur 개체의 원본 내용을 초점을 흐리게 하여 표현한다.
CheckerBoard 원본 내용을 서양 장기판처럼 작은 사각형으로 잘라 점진적으로 변화시켜 새로운 내용으로 표현한다.
Chroma 개체의 내용 중 지정한 색상을 투명하게 표현한다.
Compositor 미리 정의된 기능에따라 원래 이미지와 새 이미지의 논리적 색상 조합으로 개체의 새로운 내용을 표현한다.
DropShadow 개체의 내용을 위로 띄우는 것 처럼되고 그림자가 나타나는 효과를 생성하여 표현한다.
Emboss 개체의 내용을 회색(grayscale)값을 사용하여 음각으로 조각한 모양(emboss)으로 표현한다.
Engrave 개체의 내용을 회색(grayscale)값을 사용하여 양각으로 조각한 모양(engrave)으로 표현한다.
Fade 개체의 원본 내용을 점진적으로 새로운 내용으로 변경시켜 표시한다.
FlipH 개체의 내용을 수평으로 뒤집어 표현한다.
FlipV 개체의 내용을 수직으로 뒤집어 표현한다.
Glow 개체의 내용 주위에 에 지정된 색상과 강도로 반경을 확장하여 표현한다.
Gradient 배경과 개체들의 색상을 점진적으로 적용하여 디스플레이 한다.
GradientWipe 개체의 원본 내용을 변환 밴드를 점진적으로 이동히키면서 새로운 내용으로 표현한다.
Gray 개체의 내용을 회색 스케일(grayscale)로 표현한다.
ICMFilter ICM 프로파일에 맞춰 개체 내용의 색상을 변환한다. 이는 특정 내용의 표현을 개선하거나 프린터나 모니터와 같은 하드웨어 장치에 맞춰준다.
Inset 대각선 방향으로 개체의 내용을 새롭게 변환시킨다.
Invert 개체 내용 색상의 포화도, 밝기등을 역전 시킨다.
Iris 개체의 내용을 안에서부터 밖으로 혹은 밖에서부터 안으로 열리면서 변환하여 새 내용으로 변환한다.
Light 개체의 내용에 빛이 비치는 것과 같은 효과를 준다.
MaskFilter 개체의 투명한 내용을 색상을 넣어 표시하고, 투명하지 않은 부분은 투명하게 표현한다.
Matrix 개체의 내용의 크기 조정, 회전, 역회전등 변환하여 표현한다.
MotionBlur 개체의 내용이 달리는 것 같은 상태로 표현된다.
Pixelate 개체의 내용을 픽셀들이 위치한 사각형부분의 색상의 평균 색상으로 모두 변환하여 표현한다.
RadialWipe 개체을 내용을 반경 돌아가는에 따라 변환하여 새로운 내용으로 표현한다.
RandomBars 개체의 내용을 무작위 줄을 추가하면서 새로운 내용으로 변환하여 표현한다.
RandomDissolve 개체의 내용을 무작위 픽셀 점들의 추가로 변환하여 새로운 내용으로 표현한다.
Redirect 현재로서는 지원되지 않는 필터 속성이다.
RevealTrans 24개의 사전에 정의된 기능에 의하여 개체의 내용을 변환시켜 새로운 내용을 표현한다.
Shadow 개체의 내용을 그림자 진 것처럼 변형하여 새로운 내용으로 표현한다.
Slide 개체의 내용을 여러 띄로 나누어 흐르면서 새로운 내용으로 표현한다.
Spiral 개체의 내용을 나선형으로 변환시키면서 새로운 내용을 표현한다.
Stretch 개체의 내용을 잡아 늘리는 모양으로 변형하여 새로운 내용을 표현한다.
Strips 개체의 내용을 톱날처럼 모서리에서 반대편 모서리로 점진적으로 변환하며 새로운 내용을 표현한다.
Wave 개체의 내용을 수직 축으로 사인(sine)커브로 파도 효과를 준다.
Wheel 원본 이미지의 회전 움직임으로 변환(transition)하여 개체의 내용을 새로이 표현한다.
Xray 개체의 내용을 색상을 변경시켜 흑백으로 디스플레이하는 효과를 준다.
Zigzag 개체의 내용을 왼쪽에서 오른쪽으로, 위에서 아래로 이동하면서 새로운 내용을 만든다.

메서드설명
addBehavior 엘레멘트에 behavior를 추가한다.