[jQuery] find() 로 하위 요소 찾기 (fisrt, last, gt(), not(), eq())

jQuery find()함수 이용하여 하위 요소를 찾는 방법.

그리고 다른 함수들과 곁들여 사용하는 방법을 알아보자.

 

 find()

• . find()와. children() 함수는 비슷하지만 다르다.
• . find() : 자식 및 하위 태그 모두 찾을 때
• . chilidren() : 바로 아래 요소, 자식 요소만 찾을 때 

 

 

사용 예시 1

//1. 첫번째 .btn-up을 찾아서 attribute 변경
$("#frm").find(".btn-up:first").attr("disabled", true);

//2. 0번째보다 큰 .btn-up을 찾아서 attribute 변경
$("#frm").find(".btn-up:gt(0)").attr("disabled", false);

//3. 마지막 .btn-down을 찾아서 attribute 변경
$("#frm").find(".btn-down:last").attr("disabled", true);

//4. 변수 formLength 번째에 해당하지 않는 .btn-down을 찾아서 attribute 변경
var formLength = $('.img-form').length -1;
$("#frm").find(".btn-down:not(:eq(" + formLength + "))").attr("disabled", false);

 

 

사용 예시 2

아래와 같이 input type을 일괄적으로 찾을 수도 있다.

fnOnOffCheck : function(el) {
  var $nowSpan = $(el).closest("span");

  $nowSpan.find($('input[type=text]')).attr("disabled", true);
  $nowSpan.find($('input[type=file]')).attr("disabled", true);
  $nowSpan.find($('input[type=radio]')).attr("disabled", true);
}