제이쿼리 andSelf()
제이쿼리 andSelf()
설명 : 스택의 이전 요소 세트를 현재 세트에 추가하십시오.
참고 : 이 함수는 더 이상 사용되지 않으며 .addBack()jQuery 1.8 이상에서 사용해야 하는 별칭입니다 .
위의 설명에서 설명한 것처럼 .end()jQuery 객체는 일치하는 요소 집합에 대한 변경 사항을 추적하는 내부 스택을 유지 관리합니다. DOM 탐색 메서드 중 하나가 호출되면 새 요소 집합이 스택에 푸시됩니다. 이전 요소 세트도 원할 경우 .andSelf()도움이 될 수 있습니다.
간단한 목록이있는 페이지를 고려하십시오.
<ul>
<li>list item 1</li>
<li>list item 2</li>
<li class="third-item">list item 3</li>
<li>list item 4</li>
<li>list item 5</li>
</ul>
다음 코드의 결과는 항목 3, 4 및 5 뒤에 빨간색 배경이됩니다.
$( "li.third-item" ).nextAll().andSelf()
.css( "background-color", "red" );
먼저, 초기 선택기는 항목 3을 찾고이 항목 만 포함하는 세트로 스택을 초기화합니다. .nextAll()그런 다음 호출 은 항목 4와 5의 세트를 스택으로 푸시합니다. 마지막으로 .andSelf()호출은이 두 세트를 병합하여 문서 순서로 세 항목 모두를 가리키는 jQuery 객체를 만듭니다 [ <li.third-item>, <li>, <li> ].
예:
이 .andSelf()메서드는 순회 스택의 이전 DOM 요소 집합을 현재 집합에 추가합니다. 첫 번째 예에서 최상위 스택에는 다음과 같은 결과 집합이 포함됩니다 .find("p"). 두 번째 예에서는 .andSelf()스택에있는 이전 요소 집합 (이 경우) $( "div.after-andself" )을 div 및 닫힌 단락을 모두 선택하여 현재 집합에 추가합니다.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>andSelf demo</title>
<style>
p, div {
margin: 5px;
padding: 5px;
}
.border {
border: 2px solid red;
}
.background {
background: yellow;
}
.left, .right {
width: 45%;
float: left;
}
.right {
margin-left: 3%;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<div class="left">
<p><strong>Before <code>andSelf()</code></strong></p>
<div class="before-andself">
<p>First Paragraph</p>
<p>Second Paragraph</p>
</div>
</div>
<div class="right">
<p><strong>After <code>andSelf()</code></strong></p>
<div class="after-andself">
<p>First Paragraph</p>
<p>Second Paragraph</p>
</div>
</div>
<script>
$( "div.left, div.right" ).find( "div, div > p" ).addClass( "border" );
// First Example
$( "div.before-andself" ).find( "p" ).addClass( "background" );
// Second Example
$( "div.after-andself" ).find( "p" ).andSelf().addClass( "background" );
</script>
</body>
</html>
게시판 목록
개발자팁
질문은 QA에서 해주시기 바랍니다.
| 번호 | 분류 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|---|
| 4676 | PHP | 8년 전 | 1663 | ||
| 4675 | PHP | 8년 전 | 2082 | ||
| 4674 | PHP | 8년 전 | 1929 | ||
| 4673 | PHP | 8년 전 | 2619 | ||
| 4672 | PHP | 8년 전 | 2088 | ||
| 4671 | PHP | 8년 전 | 2640 | ||
| 4670 | PHP | 8년 전 | 1932 | ||
| 4669 | PHP | 8년 전 | 1777 | ||
| 4668 | PHP | 8년 전 | 2332 | ||
| 4667 | PHP | 8년 전 | 1950 | ||
| 4666 | PHP | 8년 전 | 2114 | ||
| 4665 | PHP | 8년 전 | 2048 | ||
| 4664 | PHP | 8년 전 | 2016 | ||
| 4663 | PHP | 8년 전 | 2114 | ||
| 4662 | PHP | 8년 전 | 2084 | ||
| 4661 | JavaScript | 8년 전 | 2953 | ||
| 4660 | PHP | 8년 전 | 1979 | ||
| 4659 | PHP | 8년 전 | 2188 | ||
| 4658 | PHP | 8년 전 | 2020 | ||
| 4657 | 웹서버 | 8년 전 | 3702 | ||
| 4656 | JavaScript | 8년 전 | 4036 | ||
| 4655 | MySQL | 8년 전 | 2591 | ||
| 4654 | MySQL | 8년 전 | 5022 | ||
| 4653 | JavaScript | 8년 전 | 3137 | ||
| 4652 | PHP |
ycolor
|
8년 전 | 1950 | |
| 4651 | MySQL | 8년 전 | 5004 | ||
| 4650 | PHP | 8년 전 | 2042 | ||
| 4649 | PHP | 8년 전 | 2246 | ||
| 4648 | PHP | 8년 전 | 2322 | ||
| 4647 | MySQL | 8년 전 | 2281 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기