자바스크립트 위치찾기(2)

children() 아래 엘리먼트들 선택

$(function(){

$('#wrapper').children().css('color', 'red');

});

next() 엘리먼트 바로 다음 형제 엘리먼트 선택, 내 바로 밑에 동생

$(function(){

$('#wrapper .first').next().css('color', 'red');

});

nextAll() 다음에 존재하는 형제 엘리먼트들 모두 선택, 동생 모두

$(function(){

$('#wrapper > ul > .first').nextAll().css('color', 'red');

});

nextUntil() 1번의 형제 엘리먼트 중 5번전까지의 형제 엘리먼트 모두 선택

$(function(){

$('#wrapper > ul > .first').nextUntil('.end').css('color', 'red');

});

parent() 부모 엘리먼트 선택

$(function(){

$('#childEl').parent().css('color', 'red');

});

parents() 조상 엘리먼트 선택, class의 경우 하나를 찾으면 거기서 멈춘다.

$(function(){

$('#childEl').parents('.parentEl').css('color', 'red');

});

parentsUntil() 조상엘리먼트중 특정 엘리먼트까지 모두

$(function(){

$('#childEl').parentsUntil('#parentEl').css('color', 'red');

});

find() 결과내 검색

$(function(){

$('#el').css('color', 'red').find('#nextEl').css('color', 'blue');

});

is() 인지 아닌지 선택된 확장집한 안에 해당 요소가 있는지 체크(boolean)

$(function(){

var el = $('#el > ul > li');

var Color;

if(el.is('#nextEl')){

Color = 'yellow';

}else

Color = 'red';

el.css('color', Color);

});