======jQuery Traversing - Filtering======
<WRAP left notice 70%>
  * description : jQuery Traversing - Filtering
  * author      : 오션
  * email       : shlim@repia.com
  * lastupdate  : 2021-04-19
</WRAP>
<WRAP clear></WRAP>
\\
====Source of the article====
[[https://www.w3schools.com/jquery/jquery_traversing_filtering.asp|jQuery Traversing - Filtering]]\\
\\
=====The first(), last(), eq(), filter() and not() Methods=====
가장 기본적인 필터링 방법은 ''first()'', ''last()'' 및 ''eq()''로, 요소 그룹에서 요소의 위치에 따라 특정 요소를 선택할 수 있습니다.\\
\\
''filter()'' 및 ''not()''과 같은 다른 필터링 방법을 사용하면 특정 기준과 일치하거나 일치하지 않는 요소들을 선택할 수 있습니다.\\

=====jQuery first() Method=====
''first()'' 메서드는 지정된 요소들 중에서 첫 번째 요소를 반환합니다.\\
\\
다음 예제는 첫 번째 <div> 요소를 선택합니다.\\

====예제====
<code jquery>
    $(document).ready(function () {
      $("div").first().css("background-color", "yellow");
    });
</code>

=====jQuery last() Method()=====
''last()'' 메서드는 지정된 요소들 중에서 마지막 요소를 반환합니다.\\
\\
다음 예제는 마지막 ''%%<div>%%'' 요소를 선택합니다.\\

====예제====
<code jquery>
    $(document).ready(function () {
      $("div").last().css("background-color", "yellow");
    });
</code>

=====jQuery eq() Method()=====
''eq()'' 메서드는 선택한 요소들 중에서 특정 인덱스 번호를 가진 요소를 반환합니다.\\
\\
인덱스 번호는 0에서 시작하므로 첫 번째 요소의 색인 번호는 1이 아니라 0입니다.\\ 
다음 예제에서는 두 번째 ''%%<p>%%'' 요소(인덱스 번호 1)를 선택합니다.\\

====예제====
<code jquery>
    $(document).ready(function () {
      $("p").eq(1).css("background-color", "yellow");
    });
</code>

=====jQuery filter() Method=====
''filter()'' 메서드를 사용하여 기준(criteria)을 지정할 수 있습니다.\\ 
기준과 일치하지 않는 요소는 선택 항목에서 제거되고 일치하는 요소가 반환됩니다.\\
\\
다음 예제는 클래스 이름이 "intro"인 모든 ''%%<p>%%'' 요소를 반환합니다.\\

====예제====
<code jquery>
    $(document).ready(function () {
      $("p").filter(".intro").css("background-color", "yellow");
    });
</code>

=====jQuery not() Method=====
''not()'' 메서드는 기준과 일치하지 않는 모든 요소들을 반환합니다.\\
\\
**Tip:** ''not()'' 메서드는 ''filter()''와 반대입니다.\\
\\
다음 예제는 클래스 이름 "intro"를 가지지 않은 모든 ''%%<p>%%'' 요소들을 반환합니다.\\

====예제====
<code jquery>
    $(document).ready(function () {
      $("p").not(".intro").css("background-color", "yellow");
    });
</code>


=====jQuery Traversing Reference=====
모든 %%jQuery%% Traversing 메서드에 대한 전체 개요를 보려면 [[https://www.w3schools.com/jquery/jquery_ref_traversing.asp|jQuery Traversing Reference]]로 이동하십시오.

{{tag>오션 jQuery Traversing - Filtering}}