자바스크립트
웹을 움직이는 언어, 자바스크립트! ES6+, Vue, React, Node.js 등 모던 JS 생태계를 깊이 있게 탐구하는 공간입니다.
2025.02.22 02:56
jQuery .closest() 메서드
jQuery .closest() 메서드는 선택한 요소에서 가장 가까운 조상 요소를 찾는 메서드입니다. 이 메서드는 선택한 요소가 포함된 DOM 트리에서 가장 가까운 조상 요소를 찾습니다.
사용법
`.closest()` 메서드는 선택한 요소에 대해 호출되어야 합니다. 선택한 요소는 `.closest()` 메서드의 인자로 전달됩니다.
예제
소스코드 분석
`.closest()` 메서드는 jQuery 내부에서 다음과 같이 구현되어 있습니다.
`.closest()` 메서드는 다음과 같은 과정을 거칩니다.
1. 선택한 요소의 목록을 가져옵니다.
2. 각 요소에 대해 반복문을 실행합니다.
3. 반복문 내에서 요소의 부모 요소를 찾습니다.
4. 부모 요소가 조건을 만족하는 경우, 결과 목록에 추가합니다.
5. 반복문이 끝나면 결과 목록을 반환합니다.
결론
`.closest()` 메서드는 선택한 요소에서 가장 가까운 조상 요소를 찾는 유용한 메서드입니다. 이 메서드는 jQuery 내부에서 구현되어 있으며, 선택한 요소의 목록을 반복문으로 처리하여 결과를 반환합니다.
jQuery .closest() 메서드는 선택한 요소에서 가장 가까운 부모 요소를 찾는 메서드입니다.
목록- 나우호스팅 오래 전 2025.02.22 02:56 인기
-
173
0
jquery .closest() jQuery .closest() 메서드
jQuery .closest() 메서드는 선택한 요소에서 가장 가까운 조상 요소를 찾는 메서드입니다. 이 메서드는 선택한 요소가 포함된 DOM 트리에서 가장 가까운 조상 요소를 찾습니다.
사용법
`.closest()` 메서드는 선택한 요소에 대해 호출되어야 합니다. 선택한 요소는 `.closest()` 메서드의 인자로 전달됩니다.
#hostingforum.kr
javascript
$(selector).closest(selector);
예제
#hostingforum.kr
html
<!DOCTYPE html>
<html>
<head>
<title>jQuery .closest() 메서드 예제</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
<div class="container">
<div class="box">
<p>이 텍스트는 box 요소에 포함되어 있습니다.</p>
<button class="btn">클릭</button>
</div>
</div>
<script>
// box 요소를 선택합니다.
var box = $(".box");
// box 요소에서 가장 가까운 container 요소를 찾습니다.
var container = box.closest(".container");
// 결과를 콘솔에 출력합니다.
console.log(container);
</script>
</body>
</html>
소스코드 분석
`.closest()` 메서드는 jQuery 내부에서 다음과 같이 구현되어 있습니다.
#hostingforum.kr
javascript
closest: function( selector ) {
var elem,
i = 0,
matches = [],
set = this;
for ( ; (elem = set[i]) != null; i++ ) {
while ( elem ) {
if ( elem.nodeType === 1 && (selector === elem.nodeName.toLowerCase() || selector === "*" || elem.matches(selector)) ) {
matches.push( elem );
break;
}
elem = elem.parentNode;
}
}
return matches;
}
`.closest()` 메서드는 다음과 같은 과정을 거칩니다.
1. 선택한 요소의 목록을 가져옵니다.
2. 각 요소에 대해 반복문을 실행합니다.
3. 반복문 내에서 요소의 부모 요소를 찾습니다.
4. 부모 요소가 조건을 만족하는 경우, 결과 목록에 추가합니다.
5. 반복문이 끝나면 결과 목록을 반환합니다.
결론
`.closest()` 메서드는 선택한 요소에서 가장 가까운 조상 요소를 찾는 유용한 메서드입니다. 이 메서드는 jQuery 내부에서 구현되어 있으며, 선택한 요소의 목록을 반복문으로 처리하여 결과를 반환합니다.
-
- 나우호스팅 @pcs8404
-
호스팅포럼 화이팅!
댓글목록
등록된 댓글이 없습니다.