본문 바로가기

CSS, Javascript, jQuery/information

jQuery selector

제이쿼리에서 제공하는 traversing 메소드를 이용하면 더 많은 요소를 선택할 수 있다.
1)위치기반 셀렉터
2)상태필터 셀렉터
3)확장집합을 관리하는 셀렉터
4)위치적 관계기반 셀렉터

eq() selector
element que 즉, 선택한 요소의 인덱스 번호를 활용하여 해당번째 요소를 선택한다.

parent() selector
$("span").parent().css()
span 태그의 직계부모요소를 선택하여 해당 css 스타일을 적용한다.

parents() selector
$("span").parents().css()
span 태그의 조상요소를 선택하여 해당 css 스타일을 적용한다.

parentsUntil() selector
$("span").parentsUntil("div").css()
span 태그의 조상요소중 div 태그전까지만 선택하여 해당 css 스타일을 적용한다.

find() selector
$("ul").find("span").css()
선택한 ul 태그의 후손 엘리먼트중의 span태그를 모두 찾아 선택한다.

is() selector
$("p").click(function(){
       var answer= $("p").parent().is("div");
       window.alert(answer); 
        }); 
선택한 p 태그의 부모 엘리먼트중의 div태그가 있는지를 boolean값으로 반환한다.

$(this).focus() =>확인 후 커서가 그쪽에 포커스가 맞춰진다.
$(this).select() =>확인 후 커서가 수정할 부분에 전체 선택이 되어져있다.
 
trigger()
액션이 취해지지 않아도 이벤트를 발생시키고 싶을 때 trigger() 메소드를 사용하거나 이벤트 타입명을 매개변수 handler를 생략하고 호출하면 해결할 수 있다.
즉, 수동으로 이벤트를 생성할 때 사용

'CSS, Javascript, jQuery > information' 카테고리의 다른 글

accordion, tooltip, autocomplete  (0) 2023.05.31
javascript method  (0) 2023.05.26
jQuery 객체 생성  (0) 2023.05.22
jQuery 메서드  (0) 2023.05.18
javascript란  (0) 2023.05.12