[JQuery 기본 개념] JQuery문법-css Selecotor/속성을 활용한 Selector 종류

2.2.1 CSS셀렉터의 종류

-$(this): 자기 자신을 나타냄.

 

-$("*"): 모든 엘리먼트를 선택.

 $('*'): 모든 엘리먼트 선택

 $('p>*'): p 엘리먼트안의 모든 자식 엘리먼트를 선택

 

-$("#id"): $('#center_div'): id 가 center_div 인 엘리먼트를 선택

 

-$(".class name"): $('.subject') : class 가 subject 인 모든 엘리먼트를 선택

 

-$("element name"): $('div'): 문서안의 모든 div 엘리먼트를 선택

 $('font'): 문서안의 모든 font 엘리먼트를 선택

 

2.2.2 속성값을 활용한 셀렉터

-요소 에 정의된 특정 속성값을 사용하여 요소를 선택할 수 있다.

 

l  $(Selector[attr])

attr속성을 갖는 엘리먼트를 선택

$('[.myclass[style]'): 클래스 명이 myclass 이고 style 속성이 있는 모든 엘리먼트를 선택

 

l  $(Selector[attr='value'])

attr 의 값이 value 인 엘리먼트(요소)를 선택한다.

$('[name=myname]'): name 속성의 값이 myname 인 모든 엘리먼트를 선택.

 

l  $(Selector[attr != 'value'])

att 속성이 없거나 attr 의 값이 value 가 아닌 요소를 선택

$("input[name != 'myname']") : input 엘리먼트중에 name 속성이 없거나 name 값이 myname 이 아닌 모든

input 엘리먼트를 선택

 

l  $(Selector[attr ^='value'])

attr 의 값이 value 로 시작하는 요소

$("id^='hello'") : id속성값이 hello 로 시작하는 모든 엘리먼트를 선택

 

l  $(Selector[attr $= 'value'])

attr 의 값이 value 로 끝나는 요소

$("input[name $='kr']") : input 엘리먼트의 name 속성값이 kr 로 끝나는 모든 엘리먼트를 선택

 

l  $(Selector[attr *= 'value'])

attr 의 값에 value 를 포함하는 요소

$("[style *='background']") : style 속성에 background 속성값이 포함된 모든 엘리먼트를 선택

$("a[href *='.com']") : a 엘리먼트들에서 href 속성 값에 .com 값이 포함된 모든 엘리먼트를 선택

 

l  $(Selector[attr ~= 'value'])

attr 의 값에 공백과 value 를 포함하는 요소. 검색될 value 값은 공백으로 분리된 단어여야 된다.

$("a[rel ~='jobtc']") : a 엘리먼트들 중에 rel속성값이 jobtc 단어가 포함된 모든 엘리먼트를 선택

 

l  $(Selector[attr |= 'value'])

attr 의 값이 value 이거나 value- 로 시작되는 요소

$("div[id |= 'bar']") : div 엘리먼트들 중에 id 속성이 bar이거나 bar- 로 시작하는 엘리먼트를 선택