jquery 계층적 선택기 형제와 nextAll_jquery의 차이점 소개

HTML 코드:

코드 복사 코드는 다음과 같습니다.

>

1

2_1

2_1_1

2_2

4

$(".one div").css("Background","red") // .one 이후의 모든 DIV 하위 요소(하위 항목: 아들과 손자 포함...)
$(".one > div").css("Background","red") // .one 뒤의 하위 요소입니다. (아들: 아들과 딸....)
$(".one div").css("Background","red") // .one 뒤의 인접 요소. .one 바로 뒤에 있는 형제 요소입니다. 하나만 있습니다
$(".one").next().css("Background","red") // 이 함수는 위와 같습니다
$(".one ~ div") .css("Background" ,"red") //.one 다음의 형제 요소입니다. 이전 제외
$(".one").nextAll().css("Background","red") //함수는 위와 동일
$(".one").siblings( ).css( "Background","red") // .one의 모든 형제 요소(뒤에 있든 앞에 있든 관계 없음)