어영's

jQuery가 지원하는 CSS 셀렉터들

​

*

모든 요소와 일치

​

E1

E1(태그명)인 모든 요소와 일치

​

E1.class

E1(태그명) 요소의 클래스가 class와 동일한 요소와 일치

​

E1.#id

E1(태그명) 요소의 id 어트리뷰트 값이 id와 동일한 요소와 일치

​

E1 E2

E1 요소의 자식인 모든 E2(태그명) 요소와 일치

​

E1 > E2

E1 요소 바로 아래 자식인 E2 요소와 일치

​

E1 + E2

E1 요소의 바로 다음에 나오는 형제요소 E2와 일치

​

E1 ~ E2

E1 요소의 다음에 나오는 모든 형제 E2와 일치

​

E1[attr]

attr 어트리뷰트를 갖는 E1 요소와 일치

​

E1[attr=val]

attr 어트리뷰트의 값이 val을 갖는 E1 요소와 일치

​

E1[attr^=val]

attr 어트리뷰트의 값이 val 값으로 시작하는 E1 요소와 일치

​

E1[attr$=val]

attr 어트리뷰트의 값이 val 값으로 끝나는 E1 요소와 일치

​

E1[attr*=val]

attr 어트리뷰트의 값이 val 값을 포함하는 E1 요소와 일치

​

​

----------------------------------

​

응용 예)

​

$('#id tr:eq(3)').hide();

tr 중에서 세번째 tr 를 숨기라

​

$('#id tr:gt(0)').hide();

tr 중에서 첫번째를 제외한 나머지 tr 들을 숨기라

​

$("#GridView1 [id$='lbltest']").text('[▼ 클릭]');

GridView1 내의 lbltest 라벨을 [▼ 클릭] 로 변경하라

jquery.js 를 두번 호출하는 경우가 가끔 있음.

그럴 때는 충돌이 발생하기 때문에 아래와 같이 선언하여 두번 이상 선언된 jquery 를 각각 사용할 수 있음.

// --------------------------------------------------

// jQuery 중복 사용시 발생되는 문제 처리

// --------------------------------------------------

var jq = jQuery.noConflict();

// --------------------------------------------------

​

jq(function () {

});

​

​

-------------------------------

​

​

$ 대신 jq (또는 다른 이름)으로 사용하면 됨

​