자바스크립트
웹을 움직이는 언어, 자바스크립트! ES6+, Vue, React, Node.js 등 모던 JS 생태계를 깊이 있게 탐구하는 공간입니다.
2025.02.22 02:54
자바스크립트의 .parent() 메서드
`.parent()` 메서드는 자바스크립트의 DOM (Document Object Model) 메서드 중 하나입니다. 이 메서드는 선택한 요소의 부모 요소를 반환합니다.
예제
소스 코드 분석
`.parent()` 메서드는 다음과 같이 구현되어 있습니다.
이 메서드는 `Element` 프로토타입에 추가되어 있습니다. `parentElement` 프로퍼티는 선택한 요소의 부모 요소를 반환합니다.
작동 원리
`.parent()` 메서드는 다음과 같은 과정을 거칩니다.
1. 선택한 요소의 `parentNode` 프로퍼티를 확인합니다.
2. `parentNode` 프로퍼티가 존재하면 부모 요소를 반환합니다.
3. `parentNode` 프로퍼티가 존재하지 않으면 `null`을 반환합니다.
예제 코드
결론
`.parent()` 메서드는 선택한 요소의 부모 요소를 반환하는 자바스크립트의 DOM 메서드입니다. 이 메서드는 `Element` 프로토타입에 추가되어 있으며, 선택한 요소의 `parentNode` 프로퍼티를 확인하여 부모 요소를 반환합니다.
부모 요소에 접근하는 jQuery .parent() 메서드
- 나우호스팅 21일 전 2025.02.22 02:54
-
13
0
jquery .parent()자바스크립트의 .parent() 메서드
`.parent()` 메서드는 자바스크립트의 DOM (Document Object Model) 메서드 중 하나입니다. 이 메서드는 선택한 요소의 부모 요소를 반환합니다.
예제
#hostingforum.kr
html
<div id="parent">
<p id="child">자식 요소</p>
</div>
#hostingforum.kr
javascript
const child = document.getElementById('child');
const parent = child.parentElement;
console.log(parent); // <div id="parent">
소스 코드 분석
`.parent()` 메서드는 다음과 같이 구현되어 있습니다.
#hostingforum.kr
javascript
Element.prototype.parentElement = function() {
if (this.parentNode) {
return this.parentNode;
} else {
return null;
}
};
이 메서드는 `Element` 프로토타입에 추가되어 있습니다. `parentElement` 프로퍼티는 선택한 요소의 부모 요소를 반환합니다.
작동 원리
`.parent()` 메서드는 다음과 같은 과정을 거칩니다.
1. 선택한 요소의 `parentNode` 프로퍼티를 확인합니다.
2. `parentNode` 프로퍼티가 존재하면 부모 요소를 반환합니다.
3. `parentNode` 프로퍼티가 존재하지 않으면 `null`을 반환합니다.
예제 코드
#hostingforum.kr
javascript
// 선택한 요소
const child = document.getElementById('child');
// 부모 요소 반환
const parent = child.parentElement;
// 부모 요소의 id 출력
console.log(parent.id); // parent
결론
`.parent()` 메서드는 선택한 요소의 부모 요소를 반환하는 자바스크립트의 DOM 메서드입니다. 이 메서드는 `Element` 프로토타입에 추가되어 있으며, 선택한 요소의 `parentNode` 프로퍼티를 확인하여 부모 요소를 반환합니다.
댓글목록
등록된 댓글이 없습니다.