개발 기록이

[JavaScript] DOM 접근 정리(2) 본문

기록/JavaScript

[JavaScript] DOM 접근 정리(2)

studyingbackhoe 2024. 8. 28. 20:10

1. 노드 태그 이름 가져오기

element.tagName

 
return : string
 

2. 노드 id 속성값 접근

element.id

 
return : string
 

3. 노드 class 속성값 접근

element.className

 
return : string 
 

4. 노드 속성 접근

element.getAttribute(속성명)

 
return string
 

5. 노드의 속성값 변경

element.setAttribute(속성명, 값)

 
return : 없음
 

6. 노드 속성 제거

element.removeAttribute(속성명)

 
return : 없음
 

7. 노드의 속성이 있는지 체크

element.hasAttribute(속성명)

 
return : boolean
 

8. 새로운 노드 생성

document.createElement(node)

 
return : element object
 

9. 노드에 생성된 새로운 노드 추가

node1.appendChild(node2)

 
return : node object
* node2를 node1의 마지막 자식으로 추가


출처 : React로 가기 위한 첫 걸음, Vanilla JS 기초 강의