Jquery
Jquery를 시작하기전에 선행 학습을 해야하는 것들
1. HTML
2. CSS
3. JavaScript
이 3가지를 먼저 학습 후 jquery를 학습하자.
Jquery는 javascript와 같은 효과를 더욱 가볍게 구현하는 경량 라이브러리이다. Javascript가 기존에 했던 것을 단순화 시켜서 구현한다.
라이브러리는 다음과 같은 것은 제공한다.
1. HTML/DOM manipulation
2. CSS manipulation
3. HTML event methods
4. Effects and animations
5. AJAX
6. Utilities
심플하면서 가벼워서 많은 인기
Jquery 설치
1. 홈페이지에서 구현시 라이브러리를 헤드 태그에 추가하면 된다.
A. Jquery는 하나의 javascript 파일이다. Html head태그에<script>태그 사이에 추가.
<head>
<script src=”jquery-1.11.1.min.js”></script>
</head>
2. Jquery.com 홈페이지에서 Jquery 라이브러리를 다운로드
A. 컨텐트 딜리버리 네트워크를 이용.
B. Google CDN:
<head>
<script src=”http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js”></script>
</head>
C. Microsofy CDN:
<head>
<script src=”http://ajax.aspnetcdn.com/ajax/jquery-1/11/1/min/js”></script>
</head>
문법
%(selector).action()
Ex)
$(“p”).hide() è 모든 p태그 숨김
$(“.test”).hide() è class가 “test”인 모든 요소를 숨김
$(“#test”).hide() è id가 “test”인 모든 요소를 숨김
Event
1. 시스템에서 일어나는 사건을 의미
2. javascript나 jQuery에게 이벤트란 브라우져에서 일어나는 사건을 의미한다. (클릭, 마우스 이동, 타이핑, 페이지 로딩등)
3. 이벤트가 발생했을 때 작동할 로직을 시스템에게 알려두면 이벤트가 발생했을 때 시스템이 그 로직을 호출한다.
jQuery의 이벤트
- 크로스브라우징의 문제를 해결해줌
- bind로 이벤트 핸들러를 설치하고, unbind로 제거 (예제1)
- trigger로 이벤트 핸들러를 강제로 실행 (예제2)
- click, ready와 같이 다양한 이벤트 헬퍼(helper)를 제공함
- live를 이용하면 현재 존재 하지 않는 엘리먼트에 이벤트 핸들러를 설치할 수 있음
