DOM(명령형 프로그래밍) 명령어

insertAdjacentHTML()

특정 위치에 HTML을 삽입합니다. 삽입 위치를 명시할 수 있으며, 주로 해당 요소의 내용을 유지한 채로 특정 위치에 HTML을 추가하는 데 사용됩니다.

insertAdjacentHTML("첫번 째 인자 종류")

• beforebegin: 현재 요소의 이전 형제로 HTML을 삽입합니다.
• afterbegin: 현재 요소의 첫 번째 자식으로 HTML을 삽입합니다.(내림차순)
• beforeend: 현재 요소의 마지막 자식으로 HTML을 삽입합니다. (오름차순)
• afterend: 현재 요소의 다음 형제로 HTML을 삽입합니다.

innerHTML()

해당 요소의 내용을 나타내거나 대체합니다. 즉, 요소의 모든 자식 요소와 텍스트를 새로운 HTML 문자열로 대체합니다.
"innerHTML은 일반적으로 getElementById, querySelector을 이용한다."

getElementById()

해당 ID를 가진 첫 번째 요소만 가져옵니다. 만약 여러 요소가 동일한 ID를 가지고 있다면, 첫 번째로 발견된 요소만 반환됩니다.

getElementsByClassName()

HTMLCollection을 반환하며, HTMLCollection은 배열이 아닌 객체입니다.
일반적으로 innerHTML을 적용할 수 없으므로 반복문을 사용하여 클래스 안에 있는 각각의 요소에 접근하여 사용할 수 있다.

HTMLCollection 종류
getElementsByTagName, getElementsByClassName,getElementsByName 등등