목차
end() 예제 - 최근 적용 필터링 해제 후, 이전 상태로 되돌리기 end() 정의 end() 구문
end() 예제 - 최근 적용 필터링 해제 후, 이전 상태로 되돌리기
<script src="https://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$( "ul.front" )
.find( ".html" )
.css( "background-color", "yellow" )
.end()
.find( ".js" )
.css( "background-color", "pink" );
});
});
</script>
<ul class="front">
<li class="html">HTML</li>
<li>CSS</li>
<li class="js">JS</li>
</ul>
<ul class="back">
<li class="php">PHP</li>
<li>SQL</li>
<li class="server">서버관리</li>
</ul>
<button>클릭</button>
결과보기
cf1. end() 메서드 없는 경우
<script src="https://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$( "ul.front" )
.find( ".html" )
.css( "background-color", "yellow" )
.find( ".js" )
.css( "background-color", "pink" );
});
});
</script>
<ul class="front">
<li class="html">HTML</li>
<li>CSS</li>
<li class="js">JS</li>
</ul>
<ul class="back">
<li class="php">PHP</li>
<li>SQL</li>
<li class="server">서버관리</li>
</ul>
<button>클릭</button>
결과보기
cf2. 마지막 필터링 뒤에도 end() 메서드 사용 시
<script src="https://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$( "ul.front" )
.find( ".html" )
.css( "background-color", "yellow" )
.end()
.find( ".js" )
.css( "background-color", "pink" )
.end();
});
});
</script>
<ul class="front">
<li class="html">HTML</li>
<li>CSS</li>
<li class="js">JS</li>
</ul>
<ul class="back">
<li class="php">PHP</li>
<li>SQL</li>
<li class="server">서버관리</li>
</ul>
<button>클릭</button>
결과보기
end() 정의
현재 체인에서 가장 최근의 필터링 작업을 끝내고 일치하는 요소집합을 이전 상태로 되돌리기.
1.
마침표(.) 이용한 체인(=연결) 방식 사용할 때 아주 유용함.
2.
마지막 필터링 뒤엔 end() 메서드 추가 불필요.
추가 시, 가독성엔 도움 되나, 성능엔 마이너스.
3. 예제 더 보기
https://api.jquery.com/end/
end() 구문
a .end().b
PS.
a: 필수. 가장 최근 적용된 필터링
b: 선택. 새로 적용할 필터링
[매개변수]
없음.
