jquery note day 1
- jquery의 가장 강력한 부분은 HTML DOM을 마음대로 순회 탐색할 수 있다.(CSS 셀렉터 처럼)
ex) div p : div 요소의 자식으로 존재하는 모든 p요소
- selector 사용 예제
$("div p") or jQuery("div p")
$("#loginID") or jQuery("loginID")
$(".Columns") or jQuery(".Columns")
$("*") //모든 요소 선택
- 각각의 표현식은 각 DOM 요소의 확장 개체인 jQuery 개체 집합을 반환
DOM요소를 직접 반환 해주는 것이 아니라 그의 Wrapper인 jQuery개체를 반환하므로
직접 DOM 요소를 제어 할때 보다 훨씬 편하고 쉽게 개체를 제어할수 있다.(이게 무슨말인가?)
- 고급 CSS 셀렉터도 지원 : 계층 셀렉터, 일반 셀렉터, 어트리뷰트 필터 셀렉터
계층 셀렉터
ex)
p > a : p요소 바로 아래 자식인 a 요소(하이퍼링크)와 일치된다.
div + p : div 요소의 바로 다음에 나오는 형제(하나) p요소와 일치
div ~ p : div 요소의 다음에 나오는 모든 형제 p 요소와 일치
어트리뷰트 필터 셀렉터(jquery 정규식 지원)
ex)
a[title] : title어트리뷰트를 갖는 하이퍼 링크와 일치
a[href^="mailto:"] : href값이 mailto로 시작하는 하이퍼 링크
a[href$=".pdf"] : pdf파일에 링크가 걸린 모든 하이퍼링크와 일치
a[href*="taeyo.net"] : taeyo.net이라는 값이 포함되어 있는 하이퍼 링크와 일치
input[type="text"] : text형식의 입력 컨트롤과 일치된다.
- $(document).ready()
jQuery가 제공하공하는 이벤트 메서드, 문서의 DOM요소들을 조작 가능한 시점이 되면 자동으로 호출이 되는
이벤트 메서드
'Programming > Jquery' 카테고리의 다른 글
jQuery v1.4.2 에서 웹브라우저 종류 체크, $.browser.msie (0) | 2014.02.05 |
---|---|
checked selected (0) | 2013.05.29 |
jquery API tokeninput (0) | 2013.03.08 |
1장 jquery 함수&메서드 정리 (0) | 2012.12.26 |
jquery 입문 (0) | 2012.12.26 |