라이브러리
[JAVASCRIPT] element.appendChild(child) - 요소를 부모 요소의 마지막 자식으로 추가
자바스크립트의 element.appendChild(child) 메서드
`element.appendChild(child)` 메서드는 HTML 요소에 자식 요소를 추가하는 방법입니다. 이 메서드는 HTML 요소의 마지막 자식 요소에 새로운 자식 요소를 추가합니다.
# Syntax
#hostingforum.kr
javascript
element.appendChild(child);
* `element`: 부모 요소
* `child`: 자식 요소
# 예제
#hostingforum.kr
html
부모 요소
이 예제에서는 `div` 요소에 `p` 요소를 추가합니다. `appendChild` 메서드를 사용하여 `p` 요소를 `div` 요소의 마지막 자식 요소로 추가합니다.
# 추가 예제: 여러 자식 요소 추가
#hostingforum.kr
html
부모 요소
이 예제에서는 `div` 요소에 두 개의 `p` 요소를 추가합니다. `appendChild` 메서드를 사용하여 두 개의 `p` 요소를 `div` 요소의 마지막 자식 요소로 추가합니다.
# 추가 예제: 자식 요소의 순서 변경
#hostingforum.kr
html
부모 요소
자식 요소 1
자식 요소 2
이 예제에서는 `div` 요소의 자식 요소의 순서를 변경합니다. `insertBefore` 메서드를 사용하여 `child2` 요소를 `child1` 요소의 앞에 추가합니다.
# 추가 예제: 자식 요소의 삭제
#hostingforum.kr
html
부모 요소
자식 요소 1
자식 요소 2
이 예제에서는 `div` 요소의 자식 요소를 삭제합니다. `removeChild` 메서드를 사용하여 `child1` 요소를 삭제합니다.
이러한 예제를 통해 `element.appendChild(child)` 메서드를 사용하여 HTML 요소에 자식 요소를 추가하고 삭제하는 방법을 이해할 수 있습니다.
댓글목록
등록된 댓글이 없습니다.