글
1. 위치 기반 셀렉터
//[모든 짝수번째<p>엘리먼트를 선택한다.]
$("p:even");
//[모든 홀수 번째<p>엘리먼트를 선택한다.]
$("p:odd");
//[(첫|마지막)번째<p>엘리먼트를 선택한다.]
$("p:(first|last)");
//(첫|마지막)번째 자식 엘리먼트. 각 리스트의 (첫|마지막)번째의 아이템을 반환한다.
$("li:(first-child|last-child)")
//형제가 없는 모든 엘리먼트를 반환한다.
$("only-child")
//[모든 테이블에서 첫째행을 선택한다.] => n값은 1부터 시작
$("table tr:n-child(1)");
//[모든 테이블에서 (짝수 | 홀수)행을 선택한다.]
$("table tr:nth-child(even|odd)");
//[n번째로 일치하는 엘리먼트] => n값은 0부터 시작
$("eq(n)");
//[n번째(포함하지 않음) 이후로 일치하는 엘리먼트] => n값은 0부터 시작
$("gt(n)");
//[n번재(포함하지 않음) 이전의 일치하는 엘리먼트] => n값은 0부터 시작
$("lt(n)");
2.CSS 셀렉터
//[<body>의 바로 아래 자식인 <div> 엘리먼트를 선택한다.]
$("body > div");
//[확장자 pdf 파일의 링크를 선택한다.]
$("a[href$=pdf]");
//[http://로 시작하는 링크를 선택한다.]
$("a[href^=http://]");
//[<body>의 바로 아래 자식이면서 링크를 포함하는 <div>엘리먼트를 선택한다.]
$("body > div:has(a)");
//[속성값이 임의의 문자열을 포함하는 엘리먼트를 찾아오라]
$("a[href*=jquery.com]");
//[선택자 id someElement 에 html을 삽입한다.]
$("#someElement").html("엘리먼트에 텍스트를 추가한다.");
//[다수의 엘리먼트와 일치하는 셀렉터에 html 추가한다.]
$("div.fillMeIn").html("노드 그룹에 텍스트를 추가한다.");
//[모든 엘리먼트와 일치한다.]
$("*");
//[E 엘리먼트 형제로 바로 다음에 나오는 엘리먼트 F와일치]
$("E+F");
//[E 엘리먼트 형제로 다음에 나오는 엘리먼트 F와일치]
$("E~F");
3. 필터 셀렉터
//[애니메이션이 적용되고 있는 엘리먼트]
$(":animated");
//[모든 버튼을 선택한다.]
$(":button");
//[모든 체크박스를 선택한다.]
$(":checkbox");
//[선택된 체크박스나 라디오 버튼을 선택한다.]
$(":checked");
//[텍스트 foo를 포함 하는 엘리먼트만을 선택한다.]
$(":contains(foo)");
//[비활성된 모든 폼 엘리먼트를 선택한다.]
$(":disabled");
//[활성된 모든 폼 엘리먼트를 선택한다.]
$(":enabled");
//[모든 파일 엘리먼트를 선택한다.]
$(":file");
//[헤더 엘리먼트를 선택한다. <h1>~<h6>]
$(":header");
//[감춰진 엘리먼트를 선택한다.]
$(":hidden");
//[폼 이미지를 선택한다.]
$(":image");
//[폼 엘리먼트를 선택한다.(input,select,textarea,button)]
$(":input");
//[필터의 값을 반대로 설정한다.]
$(":not(filter)");
//[빈엘리먼트를 제외하고 텍스트도 포함해서 자식 엘리먼틀 가지는 부모 엘리먼트를 선택한다.]
$(":parent");
//[패스워드 엘리먼트를 선택한다.]
$(":password");
//[라디오 엘리먼트를 선택한다.]
$(":radio");
//[리셋버튼을 선택한다.]
$(":reset");
//[선택된 엘리먼트를 선택한다.]
$(":selected");
//[전송버튼을 선택한다.]
$(":submit");
//[텍스트 엘리먼트 선택한다.(input type=text)]
$(":text");
//[보이는 엘리먼트를 선택한다.]
$(":visible");
//[모든 짝수번째<p>엘리먼트를 선택한다.]
$("p:even");
//[모든 홀수 번째<p>엘리먼트를 선택한다.]
$("p:odd");
//[(첫|마지막)번째<p>엘리먼트를 선택한다.]
$("p:(first|last)");
//(첫|마지막)번째 자식 엘리먼트. 각 리스트의 (첫|마지막)번째의 아이템을 반환한다.
$("li:(first-child|last-child)")
//형제가 없는 모든 엘리먼트를 반환한다.
$("only-child")
//[모든 테이블에서 첫째행을 선택한다.] => n값은 1부터 시작
$("table tr:n-child(1)");
//[모든 테이블에서 (짝수 | 홀수)행을 선택한다.]
$("table tr:nth-child(even|odd)");
//[n번째로 일치하는 엘리먼트] => n값은 0부터 시작
$("eq(n)");
//[n번째(포함하지 않음) 이후로 일치하는 엘리먼트] => n값은 0부터 시작
$("gt(n)");
//[n번재(포함하지 않음) 이전의 일치하는 엘리먼트] => n값은 0부터 시작
$("lt(n)");
2.CSS 셀렉터
//[<body>의 바로 아래 자식인 <div> 엘리먼트를 선택한다.]
$("body > div");
//[확장자 pdf 파일의 링크를 선택한다.]
$("a[href$=pdf]");
//[http://로 시작하는 링크를 선택한다.]
$("a[href^=http://]");
//[<body>의 바로 아래 자식이면서 링크를 포함하는 <div>엘리먼트를 선택한다.]
$("body > div:has(a)");
//[속성값이 임의의 문자열을 포함하는 엘리먼트를 찾아오라]
$("a[href*=jquery.com]");
//[선택자 id someElement 에 html을 삽입한다.]
$("#someElement").html("엘리먼트에 텍스트를 추가한다.");
//[다수의 엘리먼트와 일치하는 셀렉터에 html 추가한다.]
$("div.fillMeIn").html("노드 그룹에 텍스트를 추가한다.");
//[모든 엘리먼트와 일치한다.]
$("*");
//[E 엘리먼트 형제로 바로 다음에 나오는 엘리먼트 F와일치]
$("E+F");
//[E 엘리먼트 형제로 다음에 나오는 엘리먼트 F와일치]
$("E~F");
3. 필터 셀렉터
//[애니메이션이 적용되고 있는 엘리먼트]
$(":animated");
//[모든 버튼을 선택한다.]
$(":button");
//[모든 체크박스를 선택한다.]
$(":checkbox");
//[선택된 체크박스나 라디오 버튼을 선택한다.]
$(":checked");
//[텍스트 foo를 포함 하는 엘리먼트만을 선택한다.]
$(":contains(foo)");
//[비활성된 모든 폼 엘리먼트를 선택한다.]
$(":disabled");
//[활성된 모든 폼 엘리먼트를 선택한다.]
$(":enabled");
//[모든 파일 엘리먼트를 선택한다.]
$(":file");
//[헤더 엘리먼트를 선택한다. <h1>~<h6>]
$(":header");
//[감춰진 엘리먼트를 선택한다.]
$(":hidden");
//[폼 이미지를 선택한다.]
$(":image");
//[폼 엘리먼트를 선택한다.(input,select,textarea,button)]
$(":input");
//[필터의 값을 반대로 설정한다.]
$(":not(filter)");
//[빈엘리먼트를 제외하고 텍스트도 포함해서 자식 엘리먼틀 가지는 부모 엘리먼트를 선택한다.]
$(":parent");
//[패스워드 엘리먼트를 선택한다.]
$(":password");
//[라디오 엘리먼트를 선택한다.]
$(":radio");
//[리셋버튼을 선택한다.]
$(":reset");
//[선택된 엘리먼트를 선택한다.]
$(":selected");
//[전송버튼을 선택한다.]
$(":submit");
//[텍스트 엘리먼트 선택한다.(input type=text)]
$(":text");
//[보이는 엘리먼트를 선택한다.]
$(":visible");
'JS > jquery' 카테고리의 다른 글
Jquery Accordion 관련 링크 (0) | 2012.01.17 |
---|---|
폼관련 (0) | 2012.01.17 |
기초함수 (0) | 2012.01.17 |
jQuery의 기초 (0) | 2012.01.17 |
유용한 JQUERY site (0) | 2012.01.17 |
JQUERY 플러그인 (0) | 2012.01.17 |
Lazy Load Plugin for jQuery (0) | 2012.01.16 |
jQuery Fade In Scroll To Top Button With Smooth Scroll For Blogger (0) | 2012.01.16 |
Sticky Sidebar jQuery plugin (0) | 2012.01.16 |
jQuery를 이용해 스크롤바 따라다니는 레이어 만들기(IE6,IE7,IE8,크롬,사파리,파폭) (0) | 2012.01.16 |
RECENT COMMENT