element

머리말

이 장은 Gecko DOM에서 HTML과 XML 요소 대부분에 이용할 수 있는 일반 메소드(method), 프로퍼티(property), 이벤트(event)를 위한 간단한 참고자료를 제공합니다.

여러 W3C 명세가 요소에 적용됩니다.

• DOM Core 명세 — HTML과 XML 문서에서 DOM 개체 대부분이 공유하는 Core 인터페이스 기술
• DOM HTML 명세 — Core 명세를 토대로 HTML과 XHTML 문서에서 개체를 위한 인터페이스 기술
• DOM Events 명세 — DOM Core와 Views 명세를 토대로 DOM 개체 대부분이 공유하는 이벤트 기술

여기 나열된 항목은 위 명세를 span하고 알맞은 W3C DOM 명세 링크를 포함합니다.

이 인터페이스를 보통 HTML과 XML 요소 대부분이 공유하더라도, DOM HTML 명세에 나열된 특정 개체를 위한 전문 인터페이스도 더 있습니다—예를 들어 HTML Table 요소와 HTML Form 요소 인터페이스

프로퍼티

attributes

모음(collection)으로 요소 속성을 반환합니다. (DOM Core)

childNodes

배열로 요소 자식 노드를 반환합니다. (DOM Core)

className

요소 클래스를 get/set. (HTML, XUL, ...)

clientHeight

요소 안쪽(inner) 높이. (HTML 고유)

clientLeft

pixel로 나타낸 요소 왼쪽 테두리(border) 너비. 현재는 지원 안 함. (HTML 고유)

clientTop

pixel로 나타낸 요소 위쪽 테두리 너비. 현재는 지원 안 함. (HTML 고유)

clientWidth

요소 안쪽 너비. (HTML 고유)

dir

요소 방향성(directionality)을 get/set. (HTML, XUL)

firstChild

노드 첫째 직계(direct) 자식을 반환합니다. (DOM Core)

id

요소 id를 get/set. (HTML, XUL, ...)

innerHTML

요소 마크업(markup)과 content를 get/set. (HTML 고유)

lang

요소 속성값과 텍스트 content의 기반 언어를 지정합니다. (HTML 고유)

lastChild

노드 마지막 자식을 반환합니다. (DOM Core)

length

목록(예. childNodes)의 항목수를 반환합니다. (DOM Core, Element 인터페이스의 부분 아님)

localName

이 요소 한정(qualified) 이름의 지역(local) 부분을 반환합니다. (DOM Core)

name

name 속성을 get/set—모든 요소에 이용할 수 없음. (HTML 고유)

namespaceURI

이 노드의 이름공간 URI나 지정하지 않으면 null. (DOM Core)

nextSibling

트리(tree)에서 주어진 노드 바로 다음 노드를 반환합니다. (DOM Core)

nodeName

노드 이름을 반환합니다. (DOM Core)

nodeType

노드 형을 반환합니다. (DOM Core)

nodeValue

노드 값을 반환합니다. (DOM Core)

offsetHeight

layout과 관련 있는 요소 높이를 반환합니다. (HTML 고유)

offsetLeft

요소 왼쪽 테두리에서 요소 offsetParent 노드의 왼쪽 테두리까지 요소의 픽셀수(가로 거리)를 get. (HTML 고유)

offsetParent

현재 요소가 offset인 개체 reference를 반환합니다 (즉, 부모 요소). (HTML 고유)

offsetTop

요소 위쪽 테두리에서 요소 offsetParent 노드의 위쪽 테두리까지 요소의 픽셀수 (세로 거리)를 get. (HTML 고유)

offsetWidth

layout과 관련 있는 요소 너비를 반환합니다. (HTML 고유)

ownerDocument

이 노드가 나타나는 문서를 반환합니다. (DOM Core)

parentNode

요소의 부모 노드를 반환합니다. (DOM Core)

prefix

현재 노드의 이름공간 접두사(prefix)나, 지정하지 않으면 null을 반환합니다. (DOM Core)

previousSibling

트리에서 주어진 노드 바로 이전 노드를 반환합니다. (DOM Core)

scrollHeight

요소의 스크롤 뷰(scroll view) 높이를 반환합니다. (HTML 고유)

scrollLeft

요소 content가 왼쪽으로 스크롤되는 픽셀수를 get/set. (HTML 고유)

scrollTop

요소 꼭대기와 현재 보이는 요소 content의 맨 위 부분 사이의 거리를 get/set. (HTML 고유)

scrollWidth

요소의 스크롤 뷰 너비를 반환합니다. (HTML 고유)

style

요소의 style 속성 선언을 나타내는 개체를 반환합니다. (HTML, XUL, ...)

tabIndex

탭 순으로 요소 위치를 get/set. (HTML)

tagName

주어진 요소 태그 이름을 반환합니다. (DOM Core)

textContent

자손(descendant) 포함 요소의 텍스트 content를 get/set. (DOM Core)

메소드

addEventListener

이벤트 대상(target)에 이벤트 listener 등록을 허용합니다. (DOM Events)

appendChild

현재 문서의 노드 목록에 지정한 노드를 삽입합니다. (DOM Core)

blur

현재 요소에서 키보드 focus를 없앱니다. (HTML, XUL)

click

현재 요소에 클릭(click)을 모의(simulate)합니다. (HTML, XUL)

cloneNode

현재 노드의 복제(duplicate) 노드를 반환합니다. (DOM Core)

dispatchEvent

구현(implementation)의 이벤트 모델 안에 이벤트 dispatch를 허용합니다. (DOM Events)

focus

현재 요소에 focus를 설정합니다. (HTML, XUL)

getAttribute

현재 노드에 지정 속성값을 반환합니다. (DOM Core)

getAttributeNS

주어진 이름과 이름공간을 갖는 속성값을 반환합니다. (DOM Core)

getAttributeNode

개별 노드로 요소의 속성을 반환합니다. (DOM Core)

getAttributeNodeNS

getAttributeNode의 이름공간-인식(aware) 판 (DOM Core)

getElementsByTagName

현재 요소의 자손인 특정 태그 이름 요소를 반환합니다. (DOM Core)

hasAttribute

요소에 명기한 속성이 있는지를 나타내는 부울값을 반환합니다. (DOM Core)

hasAttributeNS

요소에 명기한 이름과 이름공간이 있는 속성이 있는지를 나타내는 부울값을 반환합니다. (DOM Core)

hasAttributes

요소에 어떤 속성이 있는지를 나타내는 부울값을 반환합니다. (DOM Core)

hasChildNodes

현재 요소에 자식이 있는지를 나타내는 부울값을 반환합니다. (DOM Core)

insertBefore

DOM에서 현재 요소 앞에 노드를 삽입합니다. (DOM Core)

item

index로 NodeList에서 노드를 검색합니다. (DOM Core, Element 인터페이스의 부분 아님)

normalize

노드와 하위트리 모두를 "정규화(normalize)" 꼴(form)로 바꿉니다. (DOM Core)

removeAttribute

요소에서 속성을 없앱니다. (DOM Core)

removeAttributeNS

요소에서 지정된 이름과 이름공간을 갖는 속성을 없앱니다. (DOM Core)

removeAttributeNode

요소에서 지정된 속성을 없앱니다. (DOM Core)

removeChild

현재 요소에서 자식 노드를 없앱니다. (DOM Core)

removeEventListener

요소에서 이벤트 listener를 없앱니다. (DOM Events)

replaceChild

현재 요소의 자식 노드 하나를 딴 노드로 바꿉니다. (DOM Core)

scrollIntoView

요소가 뷰에 들어갈 때까지 페이지 스크롤. (HTML)

setAttribute

새 속성을 추가하거나 현재 요소의 기존 속성값을 바꿉니다. (DOM Core)

setAttributeNS

새 속성을 추가하거나 주어진 이름공간과 이름을 갖는 속성값을 바꿉니다. (DOM Core)

setAttributeNode

현재 요소에 새 속성 노드를 추가합니다. (DOM Core)

setAttributeNodeNS

지정된 이름공간과 이름을 갖는 새 속성 노드를 추가합니다. (DOM Core)

supports

이 DOM 구현이 특정 기능을 지원하는지 시험합니다.

이벤트 처리기

이들은 HTML 'on' 이벤트 속성과 대응하는 프로퍼티입니다.

대응하는 속성과는 달리, 이 프로퍼티값은 문자열이라기보다는 차라리 함수(이거나 EventListener 인터페이스를 구현하는 기타 개체)입니다. 사실, HTML에서 event 속성 할당은 지정 코드 주위에 싸개(wrapper) 함수를 만듭니다. 예를 들어, 다음 HTML을 주면:

<div onclick="foo();">click me!</div>

element가 이 div의 reference이면, element.onclick 값은 실제로는

function onclick(event) {
   foo();
}

어떻게 event 개체를 이 싸개 함수에 매개변수 event로 넘겨주는 지 유의하세요.

onblur

blur 이벤트를 위한 이벤트 처리 코드를 반환합니다.

onchange

change 이벤트를 위한 이벤트 처리 코드를 반환합니다.

onclick

click 이벤트를 위한 이벤트 처리 코드를 반환합니다.

ondblclick

dbclick 이벤트를 위한 이벤트 처리 코드를 반환합니다.

onfocus

focus 이벤트를 위한 이벤트 처리 코드를 반환합니다.

onkeydown

keydown 이벤트를 위한 이벤트 처리 코드를 반환합니다.

onkeypress

keypress 이벤트를 위한 이벤트 처리 코드를 반환합니다.

onkeyup

keyup 이벤트를 위한 이벤트 처리 코드를 반환합니다.

onmousedown

mousedown 이벤트를 위한 이벤트 처리 코드를 반환합니다.

onmousemove

mousemove 이벤트를 위한 이벤트 처리 코드를 반환합니다.

onmouseout

mouseout 이벤트를 위한 이벤트 처리 코드를 반환합니다.

onmouseover

mouseover 이벤트를 위한 이벤트 처리 코드를 반환합니다.

onmouseup

mouseup 이벤트를 위한 이벤트 처리 코드를 반환합니다.

onresize

resize 이벤트를 위한 이벤트 처리 코드를 반환합니다.