#TIL 16일차(DOM 메서드)

---

1. getElementById(id): 지정된 id를 가진 요소를 반환⭐️

const element = document.getElementById("myId");

2. getElementsByClassName(className): 지정된 클래스 이름을 가진 모든 요소의 배열을 반환⭐️

const elements = document.getElementsByClassName("myClass");

3. getElementsByTagName(tagName): 지정된 태그 이름을 가진 모든 요소의 배열을 반환⭐️

const elements = document.getElementsByTagName("div");

4. querySelector(selector): CSS 선택자에 맞는 첫 번째 요소를 반환⭐️

const element = document.querySelector("#myId .myClass");

5. querySelectorAll(selector): CSS 선택자에 맞는 모든 요소를 반환⭐️

const elements = document.querySelectorAll("p.myClass");

6. createElement(tagName): 지정된 태그 이름의 새로운 요소를 생성

const newElement = document.createElement("div");

7. appendChild(node): 지정된 노드를 현재 요소의 자식으로 추가

parentElement.appendChild(newElement);

8.removeChild(node): 지정된 자식 노드를 삭제

parentElement.removeChild(childElement);

9. setAttribute(name, value): 지정된 속성을 가진 요소에 값을 설정

element.setAttribute("class", "myClass");

10. getAttribute(name): 지정된 속성의 값을 반환

const value = element.getAttribute("class");

11. addEventListener(event, function): 지정된 이벤트가 발생했을 때 실행할 함수를 추가⭐️

element.addEventListener("click", function() {
    // 클릭 이벤트 처리
});

자주 사용하는 메서드에는 ⭐️표시를 해놨다.