DOM parentNode와 parentElement의 차이점
기존 DOM parentNode와 Firefox 9 parentElement에서 새롭게 도입된 DOM parentNode의 차이점은 무엇인지 간단히 설명해 주시겠습니까?
parentElement파이어폭스9 및 DOM4에서는 새로운 버전이지만, 그 외의 모든 주요 브라우저에서는 오랫동안 존재해 왔습니다.
대부분의 경우 다음과 같습니다.parentNode. 유일한 차이점은 노드의 네트워크와parentNode요소가 아닙니다.그렇다면,parentElement이null.
예를 들어 다음과 같습니다.
document.body.parentNode; // the <html> element
document.body.parentElement; // the <html> element
document.documentElement.parentNode; // the document node
document.documentElement.parentElement; // null
(document.documentElement.parentNode === document); // true
(document.documentElement.parentElement === document); // false
그 이후로는<html>요소(document.documentElement)에는 요소가 되는 부모가 없습니다.parentElement이null(그 밖에도 가능성이 낮은 경우가 있습니다.parentElement그럴 수도 있겠지요null하지만 아마 그런 일은 없을 겁니다.)
Internet Explorer에서parentElementSVG 요소에는 정의되어 있지 않습니다만,parentNode정의되어 있습니다.
사용하다.parentElement문서 조각을 사용하지 않는 한 문제가 발생하지 않습니다.
문서 조각을 사용하는 경우,.parentNode:
let div = document.createDocumentFragment().appendChild(document.createElement('div'));
div.parentElement // null
div.parentNode // document fragment
기타:
let div = document.getElementById('t').content.firstChild
console.log(div.parentElement) // null
console.log(div.parentNode) // document fragment
<template id="t"><div></div></template>
보아하니 그<html>의.parentNode링크를 클릭합니다.노드는 문서에 포함되도록 정의되어 있고 문서는 문서에 포함시킬 수 없기 때문에 문서는 노드가 아니기 때문에 이는 의사 결정 페이일로 간주해야 합니다.
nextSibling 및 nextElementSibling과 마찬가지로 이름에 "element"가 있는 속성은 항상 반환됩니다.Element또는null. 이 없는 속성은 다른 종류의 노드를 반환할 수 있습니다.
console.log(document.body.parentElement, "is body's parent element");//<html>
console.log(document.body.parentNode, "is body's parent node"); //<html>
var html = document.body.parentElement;
console.log(html.parentElement, "is html's parent element"); //null
console.log(html.parentNode, "is html's parent node"); //document
한가지 더 다른 점이 있지만, 오직 인터넷 익스플로러에서만 다릅니다.HTML과 SVG를 혼재시킬 때 발생합니다.부모가 이들 2개의 '기타'인 경우 .parentNode는 부모에게, .parentElement는 정의되어 있지 않습니다.
언급URL : https://stackoverflow.com/questions/8685739/difference-between-dom-parentnode-and-parentelement
'programing' 카테고리의 다른 글
| PHP에서 두 좌표 사이의 거리 측정 (0) | 2023.01.13 |
|---|---|
| 'mariadb 다운로드 중'에서 도커 빌드에 실패했습니다. (0) | 2023.01.13 |
| 텍스트 입력 기록 사용 안 함 (0) | 2023.01.13 |
| 2013 - HAProxy를 통해 MariaDB에 연결하는 동안 '초기 통신 패킷 읽기' 시스템 오류로 MySQL Server에 대한 연결이 끊김: 0 (0) | 2023.01.13 |
| 저장 방법HTML 래퍼 없이 DOMDocument의 HTML을 사용하시겠습니까? (0) | 2023.01.03 |