문서 내의 거의 모든 객체가 상속받는 가장 범용적인 인터페이스이며 많은 프로퍼티와 메소드를 가지고 있다.
Element
인터페이스는 생성자를 가지고 있지 않은 상속을 위한 인터페이스로 존재한다.
요소의 속성 객체(Attr
)를 가진 NamedNodeMap
타입의 Collection을 조회한다.
자식 요소의 개수를 조회하는 읽기 전용 속성이다.
자식 요소을 HTMLCollection
객체로 참조한다.
요소의 class
값 목록을 유사 배열인 DOMTokenList
로 참조한다.
요소의 class
속성 값을 조회하거나 설정할 수 있다.
요소의 내부 높이를 픽셀로 조회할 수 있는 읽기 전용 속성이다.
요소의 왼쪽 테두리의 너비(픽셀)를 조회할 수 있다. 텍스트 방향이 왼쪽이고 스크롤바가 있는 경우 스크롤바의 너비를 포함한다. 왼쪽 간격과 왼쪽 내부 여백을 포함하지 않는다.
요소의 상단 테두리의 너비를 픽셀 단위로 조회할 수 있는 읽기 전용 속성이다.
요소의 내부 너비를 픽셀로 조회할 수 있는 읽기 전용 속성이다.
요소의 첫 번째 자식 요소를 참조한다. 자식 요소가 없는 경우 null
을 갖는다.
id
전역 속성을 반영하여 요소의 식별자를 나타낸다.
요소에 포함된 HTML 또는 XML 태그를 조회하거나 설정한다.
요소의 마지막 자식 요소를 참조하는 읽기 전용 속성이다. 자식 요소가 없는 경우 null
을 갖는다.
요소의 정규화된 이름의 로컬 부분을 조회한다.
요소의 네임스페이스 URI를 조회한다. 네임스페이스가 없는 경우에는 null
을 갖는다.
다음 형제 요소를 참조하며 존재하지 않는 경우에는 null
을 갖는다.
요소의 자식 요소를 포함하여 요소를 나타내는 직렬화된 HTML 일부를 조회하거나 설정한다.
요소의 부분 식별자를 나타내며 DOMTokenList
로 조회된다. 가상 요소를 통해 shadow DOM의 일부를 스타일링하는데 사용할 수 있다.
요소의 네임스페이스 접두어를 조회하거나 지정되지 않은 경우 null
을 갖는다. XML MIME 유형에서만 동작하며 HTML 문서에서는 작동하지 않는다.
이전 형제 요소를 참조하며 존재하지 않는 경우에는 null
을 갖는다.
overflow
로 인해 화면에 표시되지 않는 내용을 포함하여 요소의 콘텐츠의 높이를 조회할 수 있다.
요소의 내용이 왼쪽 가장 자리에서 스크롤되는 픽셀 수를 조회하거나 설정한다.
요소의 콘텐츠가 세로로 스크롤되는 픽셀 수를 조회하거나 설정한다.
오버플로우(overflow)로 인해 화면에 표시되지 않는 내용을 포함하여 요소의 콘텐츠의 폭을 조회할 수 있다.
요소가 호스팅하는 섀도우 루트(shadow root)를 조회한다. Element.prototype.attachShadow()
메소드를 사용하여 기존 요소에 섀도우 루트(shadow root)를 추가할 수 있다.
요소가 삽입된 섀도우(shadow) DOM 슬롯의 이름을 조회한다.
요소의 태그 명을 조회한다.
인수에 정의된 값에 따라 요소에게 애니메이션을 구현하며 애니메이션을 제어할 수 있는 Animation
객체를 반환한다.
요소에 섀도우(shadow) DOM 트리를 연결하고 ShadowRoot
에 대한 참조를 반환한다.
인수로 지정된 CSS 선택자와 일치하는 노드를 찾을 때 까지 요소의 상위(문서의 루트까지)를 탐색한다. 자신 또는 일치하는 조상 요소를 반환한다. 찾는게 없다면 null
을 반환한다.
CSSStyleDeclaration
의 대안인 CSS 선언 블록의 읽기 전용 표현을 제공하는 StylePropertyMapReadOnly
인터페이스를 반환한다.
요소에 영향을 주거나 향후에 예정되어 있는 모든 Animation
객체의 배열을 반환한다.
요소의 지정된 애트리뷰트 값을 반환한다.
요소의 모든 애트리뷰트의 이름을 문자열 배열로 반환한다.
요소의 지정된 애트리뷰트를 Attr
노드 객체로 반환한다.
지정된 네임스페이스와 이름을 가진 애트리뷰트에 대한 Attr
노드를 반환한다.
인수로 지정된 네임스페이스와 이름을 가진 애트리뷰트의 문자열 값을 반환한다.
요소의 크기와 뷰포트를 기준으로 위치를 반환한다.
CSS 테두리 상자에 대한 경계 사각형을 나타내는 DOMRect
객체 컬렉션을 반환한다.
인수로 지정된 class
이름을 가진 모든 하위 요소를 포함하는 라이브(live) 상태의 HTMLCollection
을 반환한다.
지정된 태그 이름을 가진 자신을 제외한 모든 하위 요소를 포함하는 라이브 상태의 HTMLCollection
을 반환한다.
지정된 네임스페이스에 속하는 지정된 태그 이름을 가진 모든 요소를 NodeList
타입으로 반환한다.
인수로 지정된 애트리뷰트의 존재 여부를 boolean
반환한다.
네임스페이스를 갖는 요소에 지정된 애트리뷰트가 있는지를 boolean
값으로 반환한다.
요소에 애트리뷰트가 있는지 여부를 boolean
값으로 반환한다.
호출된 요소에 지정된 포인터 ID로 식별된 포인터에 대한 포인터 캡처(capture)가 있는지 여부를 불리언(boolean)으로 반환한다.
요소의 지정된 위치에 지정된 요소를 삽입한다.
인수로 지정된 문자열을 HTML 또는 XML로 구문 분석하고 그 결과의 노드를 지정된 위치의 DOM 트리에 삽입한다.
요소에게 지정된 위치에 지정된 텍스트 노드를 삽입한다.
지정된 CSS 선택자에 의해 요소가 선택되는지 확인한다.
지정된 CSS
선택자를 갖는 하위 요소를 찾아 첫 번째로 일치하는 요소을 반환한다.
지정된 CSS
선택자를 갖는 하위 요소를 찾아 일치하는 모든 하위 요소를 NodeList
로 반환한다.
특정 포인터에 대해 이전에 설정된 포인터 캡처를 해제한다.
노드(자신)를 DOM에서 제거한다.
인수로 지정된 애트리뷰트를 제거한다.
요소에서 지정된 속성을 제거한다.
지정된 애트리뷰트를 요소에서 제거한다.
기존의 자식 항목을 지정된 자식 항목(노드 또는 문자열) 세트로 대체한다.
현재 요소를 지정된 요소로 대체한다.
비동기 요청으로 요소를 전체 화면 모드로 표시한다.
지정된 요소에 대한 포인터 잠금을 비동기적으로 요청할 수 있다.
요소 내부의 특정 좌표로 스크롤한다.
지정된 좌표를 상대적인 값으로 사용하여 스크롤한다.
요소가 사용자에게 표시되도록 요소의 상위 컨테이너를 스크롤한다.
지정된 x
, y
절대 좌표로 스크롤한다.
요소의 애트리뷰트(attribute)를 설정한다.
요소에게 새로운 Attr
노드를 추가한다.
네임스페이스 기반의 새로운 애트리뷰트 노드를 추가한다.
새 속성을 추가하거나 지정된 네임스페이스 및 이름으로 애트리뷰트의 값을 변경한다.
주어진 HTML 문자열을 구문 분석하여 유효하지 않은 HTML 문자열을 모두 제거하고 대상 요소의 하위 트리로 삽입한다.
특정 포인터를 향후 포인터 이벤트의 캡처 대상으로 지정하는 데 사용한다.
요소의 불리언(boolean) 속성을 토글한다.
CSS 애니메이션이 예기치 않게 중단이 되면 발생한다.
CSS 애니메이션이 정상적으로 완료되면 발생한다.
CSS 애니메이션의 반복이 지정되어 있는 경우 매 반복이 끝날 때 발생한다.
CSS 애니메이션이 시작되면 발생한다.
기본이 아닌 포인팅 장치 버튼(일반적으로 가장 왼쪽에 있는 기본 버튼 이외의 모든 마우스 버튼)을 눌렀다가 뗐을 때 발생한다.
<input>
,<select>
, <textarea>
요소의 값이 변경되려고 할 때 발생한다.
요소의 hidden
애트리뷰트가 until-found
값을 갖는 경우에 발생한다.
요소가 비활성 될 때 이벤트 발생한다.
마우스 왼쪽 버튼을 눌렀다 뗐을 경우 발생한다.
입력 방식 편집기(IME)와 같은 시스템 소프트웨어로 작성시 시스템이 현재 작성 세션을 완료하거나 취소하면 발생한다.
입력 방식 편집기(IME)와 같은 시스템 소프트웨어로 작성시 시스템이 현재 작성 세션을 시작할 때 발생한다.
입력 방식 편집기(IME)와 같은 시스템 소프트웨어로 작성시 시스템이 현재 작성 세션의 컨텍스트에서 새 문자가 수신되면 발생한다.
CSS 속성 content-visibility
값이 auto
인 요소가 사용자와 관련이 시작되거나 또는 중지되어 렌더링을 건너뛸 때 발생한다.
사용자가 컨텍스트 메뉴를 열려고 할 때 발생한다.
사용자가 유저 에이전트의 사용자 인터페이스를 통해 복사 작업을 수행할 때 발생한다
선택이 잘라내기 되어진 후 클립보드로 복사되었을 때 발생한다.
마우스 왼쪽 버튼을 빠르게 두번 클릭할 때 발생한다.
요소(element
)가 포커스(focus
)를 받을 때 발생한다.
요소가 포커스(focus)를 받으면 발생한다.
요소가 포커스(focus)를 잃을 때 발생한다.
지정 요소가 전체 화면 모드로 전환되거나 해제될 때 발생한다.
전체 화면 모드로 전환하거나 외부에서 전환하려고 시도하는 동안 오류가 발생하면 요소로 전송되는 이벤트이다.
요소가 setPointerCapture()
메소드를 사용하여 포인터를 캡처하면 발생한다.
<input>
, <select>
, <textarea>
요소에 대한 입력 이벤트이다.
키보드의 키를 누를 때 발생한다.
Shift, Fn, CapsLock 키를 제외한 키가 눌린 상태일 때 연속적으로 발생한다.
키보드의 키를 누르고 있다가 뗐을 때 발생한다.
캡처된 포인터가 해제될 때 발생한다.
마우스 포인터가 대상 요소 안에 있는 동안 마우스 버튼을 누를 때 발생한다.
입력 장치의 포인터가 요소 위로 이동했을 때 발생한다.
입력 장치의 포인터가 요소에서 벗어 날때 발생한다.
마우스 포인터의 움직임이 있을 때 이벤트가 발생한다.
입력 장치의 포인터가 요소를 벗어 날 때 발생한다. mouseleave
와 다른 점은 하위 요소 발생을 포함한다.
마우스 포인터가 대상 요소와 겹칠 때 이벤트가 발생한다.
마우스 포인터가 대상 요소 안에 있는 동안 마우스 버튼을 누르고 해제할 때 이벤트가 발생한다.
클립보드의 항목이 불여넣기 되어질 때 발생한다.
웹브라우저가 더 이상 포인터 이벤트가 없을 가능성이 있다고 판단하거나 pointerdown
이벤트가 발생한 후 포인터를 사용하여 이동, 확대, 축소 또는 스크롤을 통해 뷰포트를 조작하는데 사용할 수 있다.
포인터가 활성화되면 발생한다. 마우스의 경우 장치가 눌린 버튼이 없는 상태에서 하나 이상의 버튼이 눌려진 상태로 전환되면 발생한다. 터치의 경우 디지타이저와 물리적 접촉이 이루어지면 발생한다. 펜의 경우 스타일러스가 디지타이저와 물리적으로 접촉하면 발생한다.
포인팅 장치가 hover를 지원하지 않는 장치의 pointerdown 이벤트의 결과를 포함하여 요소 또는 그 자손 중 하나의 맞추어진 테스트 경계로 이동할 때 발생한다.
포인팅 장치가 요소의 맞춰진 테스트 경계를 벗어나면 발생한다. 펜 장치의 경우 스타일러스가 디지타이저에서 감지할 수 있는 hover
범위를 벗어날 때 발생한다.
포인터가 좌표를 변경하고 웹브라우저 터치 동작으로 취소되지 않은 경우 발생한다.
포인팅 장치가 요소의 맞춰진 테스트 경계 밖으로 이동할 때 발생한다.
포인팅 장치가 요소의 맞춰진 테스트 경계로 이동하면 발생한다.
포인터가 pointerdown
또는 pointerup
이벤트를 실행하지 않는 속성을 변경할 때 이벤트가 발생한다.
포인터가 더 이상 활성화되지 않으면 발생한다.
요소가 스크롤 될 때 발생한다.
스크롤이 완료되면 VisualViewport
, Document
또는 Element
에서 발생한다.
정책과 버블(bubble)을 위반하는 요소에서 발생한다.
하나 이상의 터치 포인트가 구현별 방식으로 중단된 경우 발생한다.
터치 장치의 표면에서 하나 이상의 터치 포인트가 제거될 때 발생한다.
하나 이상의 터치 포인트가 터치 표면을 따라 이동할 때 발생한다.
하나 이상의 터치 포인트가 터치 표면에 닿을 때 발생한다.
CSS 전이 효과가 취소되었을 때 발생한다.
CSS의 전이 효과가 완료되었을 때 발생한다.
CSS 전이 효과를 시작했을 때 발생한다. 지연 시간이 설정된 경우 포함해서 시작된 경우에 발생한다.
CSS 전이 효과가 실제로 시작되었을 때(지연이 있는 경우 지연 시간 이후 실행될 때) 발생한다.
포인팅 입력 장치에서 휠 버튼을 회전할 때 발생한다.
기본 URL을 조회한다.
현재 노드의 자식 노드 집합체 NodeList
를 라이브(live)로 참조한다.
첫 번째 자식 노드를 참조한다. 존재하지 않는 경우 null
을 갖는다.
노드가 컨텍스트(Document) 객체에 직접 또는 간접적으로 연결되어 있는지에 대한 불리언(boolean) 값을 가지고 있다.
마지막 자식 노드를 참조한다. 존재하지 않는 경우 null
을 갖는다.
순서에 따라 현재 노드의 다음 형제 노드를 참조한다. 더 이상의 노드가 조회되지 않는 경우에는 null
을 갖는다.
노드의 이름을 조회할 수 있다.
노드 유형을 조회할 수 있다.
노드의 값을 조회하거나 설정할 수 있다.
현재 노드의 최상위 document
객체를 참조한다.
현재 노드의 부모 요소(element)를 참조한다. 부모 요소가 없거나 부모가 DOM 요소가 아닌 경우에는 null
을 갖는다.
현재 노드의 부모 노드를 참조한다.
순서에 따라 현재 노드의 이전 형제 노드를 참조한다. 더 이상의 노드가 조회되지 않는 경우에는 null
을 갖는다.
현재 노드와 하위의 텍스트 콘텐츠를 조회하거나 설정한다.
지정된 노드(node) 객체를 자식 노드로 끝에 추가한다.
노드를 새로운 노드로 복사한다.
현재 노드를 기준으로 지정된 노드의 위치를 문서 내 다른 노드와 비교하여 기본적으로 정의된 값을 반환한다.
현재 노드가 지정된 노드를 포함하고 있는지를 확인하여 그 결과를 불리언(boolean)으로 반환한다.
현재 노드의 루트를 반환하며 사용 가능한 경우 섀도우 루트(shadow root)를 선택적으로 반환한다.
현재 노드에 대한 자식 노드의 존재 여부를 불리언(boolean)으로 반환한다.
지정된 새 자식 노드를 지정된 기존 자식 노드 앞에 추가한다. 새로운 자식 노드가 기존 노드인 경우에는 위치가 이동된다.
네임스페이스 URI
를 인수로 받아 지정된 네임스페이스가 현재 노드의 기본 네임스페이스인 경우 true
, 그렇지 않은 경우 false
를 반환한다.
지정된 노드와 동일한지를 테스트하고 그 결과를 불리언(boolean)으로 반환한다.
현재 노드가 지정된 노드와 같은지(===
연산자와 동일)에 대한 여부, 즉 동일한 객체를 참조하는지를 테스트하여 그 결과를 불리언(boolean)으로 반환한다.
현재 노드에서 지정된 프리픽스(prefix)와 일치하는 네임스페이스를 반환한다.
지정된 네임스페이스 URI
가 있는 경우 해당 접두사가 포함된 문자열을 반환하고 그렇지 않은 경우 null
을 반환한다.
현재 노드와 모든 하위 트리를 정규화된 형식으로 변환한다.
자식 노드를 제거하고 제거된 노드를 반환한다.
현재 노드에서 지정된 기존 자식 노드를 새로운 노드로 대체한다.
EventTarget
인터페이스를 상속받는 하위 요소들의 이벤트 리스너(Listener)를 등록한다. Window
객체도 포함된다.
사용자가 생성한 이벤트를 전달한다. 코드에 의한 이벤트 트리거(trigger)에 사용된다.
등록된 이벤트를 제거한다. 이벤트 타입, 등록된 함수, 등록시 제공했던 다양한 옵션과 일치된 경우에 이벤트를 제거한다.
객체가 특정 프로퍼티를 가지고 있는지를 블린(boolean
) 값으로 반환한다.
해당 객체가 다른 객체의 프로토타입 체인에 속한 객체인지를 체크한다.
매개 변수의 속성이 열거가능(enumerable)한지 여부를 체크한다.
객체를 나타내는 문자열을 작동하는 지역(locale)의 방식으로 출력이 된다.
객체를 나타내는 문자열을 반환한다.
객체의 원시(primitive) 값을 반환한다.
객체의 생성자 함수를 참조한다.
상속된 [[Prototype]]
참조하거나 설정가능하며 일반적으로 실제 코드상에서는 잘 사용되지 않는다. ECMAScript에서 사용되지 않는 비표준이지만 최신 웹브라우저에서는 비공식적으로 지원하고 있다. 따라서 곧 표준 속성으로 지원될 확률이 높다.