jQuery정리 - CSS셀렉터

CSS 셀렉터

(1) jQuery에서 제어할 대상에 접근하는 방법
- jQuery는 제어할 요소를 획득하기 위해서 $() 함수 안에 대상을 의미하는 CSS 셀렉터를 
  파라미터로 전달한다.

 

$('div') : div태그 선택

 

(2) CSS 자식 셀렉터
- ">" : 자식셀렉터, HTML 태그의 계층 구조를 표현한다.

 

(3) CSS 자손 셀렉터
- 자손 셀렉터는 태그의 계층 관계를 나타낸다.
- 자식 셀렉터와 다르게, 명시과정에서 중간단계를 생략해도 된다.

 

(4) 특정 요소를 구체적으로 서술하기
- HTML 태그와 class 또는 id 속성과 함께 명시된다.
- 특정 요소를 더욱 정교하게 명시하고자 할 때 사용한다.
- "A#B" : id 속성이 B인 A태그
- "A.B" : class 속성이 B인 A태그

 

(5) HTML 태그의 속성에 따른 구분
- CSS 셀렉터가 적용되는 대상에게 특정 속성이 있는지 여부와 특정 속성의 값이 적용되어 있는지    여부에 따라서 태그 요소를 좀 더 구체적으로 가리킬 수 있다.
- selector[속성] : []안에 명시된 태그 속성을 갖는 요소를 의미한다.
- selector[속성=값] : []안에 명시된 태그 속성이 지정된 값을 갖는 요소를 의미한다.

 

 

 

jQuery 이벤트

이벤트 정의하는 방법
$(function() {
   $("셀렉터“).이벤트이름(function() {
      ... 처리 내용 ...
   });
});

jQuery 이벤트 종류