JavaScript에서 lastChild와 lastElementChild DOM 요소 속성의 차이점
3304 단어 javascript
lastChild DOM 요소 속성과 lastElementChild DOM 요소 속성 간의 핵심 차이점은 다음과 같습니다.lastChild DOM 요소 속성은 부모 요소에서 마지막으로 오는 text , comment 또는 Element를 반환합니다. 간단히 말해서, text , comment 또는 Element 유형이든 마지막 항목을 반환합니다. lastElementChild 요소 속성은 마지막 Element 유형을 값으로 반환합니다. 그 뒤에 text 또는 comment가 와도 text 또는 comment를 값으로 반환하지 않습니다. 예를 들어 보겠습니다.
다음과 함께 이
div 태그를 고려하십시오.span 태그text의 Hello World! paragraph 태그 Hai, I'm another simple text의 다른 텍스트그 안에 자식으로.
<div>
<span>I'm inside a SPAN tag</span>
Hello World!
<p>I'm a paragraph</p>
Hai, I'm another simple text.
</div>
이제
lastChild 요소의 lastElementChild 및 div DOM 요소 속성을 사용하여 반환되는 내용을 확인하겠습니다.// get reference to the div tag
const div = document.querySelector("div");
// lastChild DOM element property
const lastChild = div.lastChild;
// lastElementChild DOM element property
const lastElementChild = div.lastElementChild;
console.log(lastChild); // Hai, I'm another simple text.
console.log(lastElementChild); // <p>I'm a paragraph</p>
보시다시피
lastChild는 마지막 텍스트 내용Hai, I'm another simple text을 반환하고 lastElementChild는 마지막 요소, 즉 para 태그( <p>I'm a paragraph</p> )를 반환합니다.JSBin에 있는 이 예제를 참조하세요.
😃 유용하셨다면 공유해 주세요.
Reference
이 문제에 관하여(JavaScript에서 lastChild와 lastElementChild DOM 요소 속성의 차이점), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/melvin2016/differences-between-lastchild-and-lastelementchild-dom-element-property-in-javascript-m8k텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
