[JS] createElement 와 appendChild + 속성 꿀팁

[JS] createElement 와 appendChild + 속성 꿀팁

노드 추가

createElement는 요소를 만드는 메서드이고 appendChild는 요소를 연결해주는 메서드이다. 아래 예시 통해 보자 img 태그를 html에 추가하고 싶다면 다음과 같다. const image = document.createElement("img"); document.body.appendChild(image);

하지만 img엔 src와 alt 등의 값이 필요한데 이는 원래 다음과 같지만

const imgSrc = document.createAttribute("src"); imgSrc.value = `./~` ;

더 간단한 방법이 있다.

imgSrc.src = `이미지 주소`;

같은 방식으로 가능하다.

그리고 div 나 p 태그 같은 경우는 text 내용이 필요한데 이는

const a = document.creatTextNode("텍스트"); 노드.appendChild(a);

로 추가할 수 있다.

from http://jrepository.tistory.com/28 by ccl(A) rewrite - 2021-12-31 01:01:04