JavaScript

[DOM_Element] JS - Element 객체 - 요소객체 (속성 + 메서드) 종류

Element 객체 의미

 

HTML DOM에서 Element 객체는 P, DIV, A, TABLE 또는 기타 HTML 요소와 같은 HTML 요소 의미.

 

 

 

Element 객체 속성 및 메서드

 

accessKey

요소의 액세스 키 특성을 설정하거나 반환.

 

addEventListener ()

지정된 요소에 이벤트 처리기를 연결.

 

appendChild ()

요소에 마지막 자식 노드로 새 자식 노드를 추가.

 

attributes

요소의 속성에 대한 NamedNodeMap 반환.

 


 

blur ()

요소에서 포커스 제거.

 


 

childElementCount

요소가 가지고있는 자식 요소의 개수 반환.

 

childNodes

요소의 자식노드 (텍스트 노드와 주석 노드 포함) 모음 반환.

 

children

요소의 하위요소 (텍스트 및 주석 노드 제외) 모음 반환.

 

classList

요소의 클래스명 반환.

 

className

요소의 클래스 특성값 설정하거나 반환.

 

click ()

요소를 마우스로 클릭하는 것을 시뮬레이션.

 

clientHeight

padding 포함한 요소 높이 반환.

 

clientLeft

요소의 왼쪽 테두리의 너비 반환.

 

clientTop

요소의 위쪽 테두리의 너비 반환.

 

clientWidth

padding 포함한 요소의 너비 반환.

 

cloneNode ()

요소를 복제.

 

compareDocumentPosition ()

2개 요소의 문서 위치를 비교.

 

contains ()

노드가 노드의 하위 노드이면 true 반환하고 그렇지 않으면 false 반환.

 

contentEditable

요소 내용 편집 가두 여부를 설정하거나 반환.

 


 

dir

요소의 dir 특성 값을 설정하거나 반환.

 


 

exitFullscreen ()

전체화면모드에서 요소 취소.

 


 

firstChild

요소의 첫 번째 자식 노드 반환.

 

firstElementChild

요소의 첫 번째 자식 요소를 반환.

 

focus ()

요소에 초점 맞추기. (= 마우스커서 두기.) 

 


 

getAttribute ()

요소 노드의 지정된 속성값 반환.

 

getAttributeNode ()

지정된 속성 노드 반환.

 

getBoundingClientRect ()

viewport 기준으로하는 요소의 크기와 그 위치를 반환.

 

getElementsByClassName ()

지정된 클래스명 갖는 모든 자식 요소 모음 반환.

 

getElementsByTagName ()

지정된 태그명의 자식 요소 모두 반환.

 


 

hasAttribute ()

요소가 지정된 속성 갖으 true 반환하고 그렇지 않으면 false 반환.

 

hasAttributes ()

요소에 속성이 있는 경우는 true 반환, 그렇지 않은 경우는 false 반환.

 

hasChildNodes ()

요소에 자식 노드 있으면 true 반환하고 그렇지 않으면 false 반환.

 


 

id

요소의 id 속성값 설정하거나 반환.

 

innerHTML

요소의 내용을 설정하거나 반환.

 

innerText

노드 및 노드의 자손의 텍스트 내용을 설정하거나 반환.

 

insertAdjacentElement ()

현재 요소를 기준으로 지정된 위치에 HTML 요소 삽입.

 

insertAdjacentHTML ()

현재 요소 기준으로 지정된 위치에 HTML 형식의 텍스트 삽입.

 

insertAdjacentText ()

텍스트를 현재 요소 기준으로 지정된 위치에 삽입.

 

insertBefore ()

지정된 기존의 자식 노드 앞에 새 자식 노드 삽입.

 

isContentEditable

요소의 내용이 편집 가능한 경우 true 반환, 그렇지 않으면 false 반환.

 

isDefaultNamespace ()

지정된 namespaceURI가 기본값이면 true 반환, 그렇지 않으면 false 반환.

 

isEqualNode ()

두 요소가 같은지 검사.

 

isSameNode ()

2 개의 요소가 같은 노드인지 판정.

 

isSupported ()

지정된 기능이 요소에서 지원되면 true 반환.

 


 

lang

요소의 lang 속성 값을 설정하거나 반환.

 

lastChild

요소의 마지막 자식 노드 반환.

 

lastElementChild

요소의 마지막 자식 요소를 반환.

 


 

namespaceURI

요소의 네임 스페이스 URI 반환.

 

nextSibling

동일한 노드 트리 레벨에서 다음 노드 반환.


nextElementSibling

동일한 노드 트리 레벨에서 다음 요소 반환.

 

nodeName

노드의 이름 반환.

 

nodeType

노드의 노드타입 반환.

 

nodeValue

노드 값을 설정하거나 반환.

 

normalize ()

인접한 텍스트 노드를 결합하고 요소의 빈 텍스트 노드를 제거.

 


 

offsetHeight

padding, border, scrollbar 포함하여 요소 높이 반환.

 

offsetWidth

padding, border, scrollbar 포함하여 요소 너비 반환.

 

offsetLeft

요소의 수평 오프셋 위치를 반환.

 

offsetParent

요소의 오프셋 컨테이너 반환.

 

offsetTop

요소의 수직 오프셋 위치 반환.

 

ownerDocument

요소의 루트 요소 (문서 객체) 반환.

 


 

parentNode

요소의 부모 노드 반환.

 

parentElement

요소의 부모요소 노드 반환.

 

previousSibling

동일한 노드 트리 레벨에서 이전 노드 반환.

 

previousElementSibling

동일한 노드 트리 레벨에서 이전 요소 반환.

 


 

querySelector ()

요소의 지정된 CSS 선택자와 일치하는 첫번째 자식요소 반환.

 

querySelectorAll ()

요소의 지정된 CSS 선택자와 일치하는 모든 자식 요소 반환.

 


 

removeAttribute ()

지정된 속성을 요소에서 제거.

 

removeAttributeNode ()

지정된 속성 노드를 제거하고 제거된 노드를 반환.

 

removeChild ()

요소에서 자식 노드를 제거.

 

removeEventListener ()

addEventListener () 메서드로 첨부된 이벤트 핸들러 제거.

 

replaceChild ()

요소의 자식 노드 변경.

 

requestFullscreen ()

요소를 전체 화면 모드로 표시.

 


 

scrollHeight

padding 포함하여 요소의 전체 높이 반환.

 

scrollIntoView ()

지정된 요소를 브라우저 윈도우의 보이는 영역으로 스크롤.

 

scrollLeft

요소의 내용이 가로로 스크롤되는 픽셀 개수 설정하거나 반환.

 

scrollTop

요소의 내용이 세로로 스크롤되는 픽셀 개수 설정하거나 반환.

 

scrollWidth

padding 포함하여 요소의 전체 너비를 반환.

 

setAttribute ()

지정된 속성을 지정된 값으로 설정하거나 변경.

 

setAttributeNode ()

지정된 속성 노드를 설정 또는 변경.

 

style

요소의 스타일 속성 값을 설정하거나 반환.

 


 

tabIndex

요소의 tabindex 특성 값을 설정하거나 반환.

 

tagName

요소의 태그 이름을 반환.

 

textContent

노드 및 노드의 자손의 텍스트 내용을 설정하거나 반환.

 

title

요소의 title 속성 값을 설정하거나 반환.

 

toString ()

요소를 캐릭터 라인으로 변환. 




분류 제목
Form JS - Forms - 폼양식 유효성 제어
DOM JS - Document - 문서객체
DOM JS - Element Selector - 주요 요소선택자 (= 객체찾기) ※ JS외부링크호출 주의사항
DOM_Document JS - Document 객체 - 웹문서 객체의 속성/메서드 종류 (= document객체 = 다큐먼트객체)
DOM_Element JS - Element 객체 - 요소객체 (속성 + 메서드) 종류
DOM_Document JS - getElementById() 메서드 ★★★ - 아이디선택자 (= 아이디로 요소얻기 = 아이디로 요…
DOM_Document JS - getElementsByClassName() 메서드 ★★ - 클래스선택자 (= 클래스명선택자 = 클…
DOM_Document JS - getElementsByName() 메서드 ★ - 네임선택자
DOM_Document JS - getElementsByTagName() 메서드 ★ - 태그선택자 (= 요소선택자 = getElem…
DOM_Document JS - querySelector() 메서드 ★ - 쿼리선택자 (= 문서 안 지정 선택자 중 첫번째 것만 =…
DOM_Document JS - querySelectorAll() 메서드 ★★★ - 일치요소 모두 선택 (= querySelecto…
DOM_Element JS - getElementsByClassName() 메서드 - 클래스선택자 (= 클래스명선택자 = 클래스이…
DOM_Element JS - getElementsBy태그Name() 메서드 - 태그선택자 (= 요소선택자 = 태그명선택자 = 태…
DOM_Element JS - querySelector() 메서드 ★ - 쿼리선택자 (= 요소 안 지정 선택자 중 첫번째 것만) …
DOM_Element JS - querySelectorAll() 메서드 - Element객체의 쿼리선택자_전부 (= 쿼리선택자_모…
1/2
목록
 홈  PC버전 로그인 일본어
그누앞단언어
그누뒷단언어
그외코딩언어
그누보드 1
제작의뢰
Q&A
커뮤니티
웹유틸
회원센터
홈짱닷컴 PC버전 로그인