Jquery[제이쿼리] :has() 셀렉터 배우기

안녕하세요~ 제이쿼리공장장 주니주니 입니다.

오늘은 제이쿼리[jquery] :has() 셀렉터를 배워보겠습니다.

어제 했던 부분에서 조금수정하여 준비해보았습니다.

이렇게나오면 준비완료!

=============================== 
$('.input1').on("click",function(){
   var Text1 = $('input[type="text"]').val();
   $('.div1:has('+Text1+')').css('border','4px solid blue');
   
   setTimeout(function(){
    $('.div1:has('+Text1+')').css("border","2px solid black");
   }, 1000); 
  });
=============================== 
class input1가 click되면 <== "검색 버튼입니다.
Test1변수에 test박스의 value값을 들고와 저장합니다.
그다음 class div1:has()셀렉터로 Test1변수에 있는 값으로 검색하여 해당요소의
css를 변경합니다.
※has() 셀렉터란 자식요소중 ()안 태그를 가지고 있는 부모를 선택합니다.
※setTimeout()<== 부분은 저번시간에 했기때문에 설명을 생략하도록 하겠습니다.

<p>태그를 가지고있는 부모를 검색하여보았습니다.

setTimeout()메서드로 1초뒤에 css부분이 변경되기전으로 돌아온모습입니다.

<a>태그를 가지고있는 부모를 검색하여보았습니다.

<textarea>태그를 가지고있는 부모를 검색하여보았습니다.

오늘은  제이쿼리[jquery] :has() 셀렉터를 배워보았습니다.