티스토리 뷰
parentElement
부모 element를 가져온다.
parentNode
부모 element를 가져온다.
소스코드
<form>
<input class="param" id="param1" value="seogineer" /><br>
<input class="param" id="param2" value="" /><br>
<button>button</button>
</form>let el = document.getElementById('param1').parentElement;
console.log(el);
let el2 = document.getElementById('param1').parentNode;
console.log(el2);결과
차이점
- parentElement: 부모 element 노드를 반환.
부모 element 노드가 더이상 없을 경우 null 반환한다. - parentNode: 종류에 상관없이 부모 노드를 반환.
- parentElement는
<html>까지 거슬러 올라가고, document까지 가고 싶지 않을 때 사용.
소스코드
console.log(document.documentElement.parentNode);
console.log(document.documentElement.parentElement);결과
참조
https://ko.javascript.info/dom-navigation
https://gafani.tistory.com/entry/javascript-%EB%B6%80%EB%AA%A8-%EC%97%98%EB%A6%AC%EB%A8%BC%ED%8A%B8%EB%85%B8%EB%93%9C
https://www.w3schools.com/jsref/prop_node_parentnode.asp
https://www.w3schools.com/jsref/prop_node_parentelement.asp
'Language > Javascript' 카테고리의 다른 글
| 배열과 배열 탐색, 함수 (0) | 2020.12.28 |
|---|---|
| appendChild(), insertBefore() (0) | 2020.12.27 |
| querySelector(), getElementById() (0) | 2020.12.26 |
| HTML에서 자바스크립트로 값 전달 (0) | 2020.12.26 |
| Ajax(XMLHTTPRequest 통신) (0) | 2020.12.26 |
댓글
