테스트 사이트 - 개발 중인 베타 버전입니다
SIR

제이쿼리 andSelf()

수다왕
프로필 보기이 회원 글보기이 회원의 댓글보기
 · 8년 전 · 2070

제이쿼리 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>

목록
이전글 다음글

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

게시글 목록

번호 제목
15819
jQuery 제이쿼리 jQuery( ":button" )
15818
jQuery 제이쿼리 .bind( eventType [, eventData ], handler )
15817
jQuery 제이쿼리 .before(content [,content])
15816
jQuery 제이쿼리 Attribute Starts With Selector [name^=”value”]
15815
jQuery 제이쿼리 Attribute Not Equal Selector [name!=”value”]
15814
jQuery 제이쿼리 Attribute Equals Selector [name=”value”]
15813
jQuery 제이쿼리 Attribute Ends With Selector [name$=”value”]
15812
jQuery 제이쿼리 Attribute Contains Word Selector [name~=”value”]
15811
jQuery 제이쿼리 Attribute Contains Selector [name*=”value”]
15810
jQuery 제이쿼리 attributeContainsPrefix selector
15809
jQuery 제이쿼리 .attr (attributeName)
15808
jQuery 제이쿼리 .appendTo( target )
15807
jQuery .append (content [, content])
15806
jQuery animated selector
15805
jQuery .animate (properties [, duration] [, easing] [, complete])
15804
jQuery 제이쿼리 andSelf() 현재글
15803
jQuery 제이쿼리 all selector
15802
jQuery 제이쿼리 .ajaxSuccess(handler)
15801
jQuery .ajaxStop(handler )
15800
jQuery .ajaxStart(handler )
15799
jQuery .ajaxSend (handler )
15798
jQuery 제이쿼리 .ajaxError (handler)
15797
jQuery 제이쿼리 .ajaxComplete (handler)
15796
jQuery 제이쿼리 .after()
15792
PHP 제이쿼리 .addClass ()
15791
jQuery 제이쿼리 .addBack ()
15790
jQuery 제이쿼리 .add (selector)
15789
PHP is_null - 변수가 있는지 여부를 찾습니다.NULL
15788
PHP is_iterable - 변수의 내용이 반복 가능한 값인지 확인합니다.
15787
PHP is_int - 변수의 타입이 정수인지 찾기
이전 다음
전체 목록