카테고리 없음

`appendChild`메서드

개발_자 2024. 7. 18. 12:01

`appendChild`

JS에서 DOM 요소를 다른 요소의 자식으로 추가할 때 사용

이 메서드는 한 요소를 다른 요소의 마지막 자식으로 삽입함

 

기본 사용법

parentElement.appendChild(childElement);

`parentElement` : 자식 요소를 추가할 부모 요소

`childElement` : 추가할 자식 요소

 

 

 

 

예제

<html>

<div id="parent">
  <p>Existing Child</p>
</div>​

 

 

<js>

const parent = document.getElementById('parent');
const newChild = document.createElement('p');
newChild.textContent = 'New Child';
parent.appendChild(newChild);

 

`appendChild` 메서드를 사용하여

`newChild`요소를 `parent`요소의 마지막 자식으로 추가

 

<div id="parent">
  <p>Existing Child</p>
  <p>New Child</p>
</div>

 

그 결과 이렇게 됨