* 제이쿼리란?
- 제이쿼리는 모질라 사의 자바스크립트 개발자였던 존 레식(John Resig)이 창시함.
- 제이쿼리는 자바스크립트를 이용해 만든 라이브러리 언어(자바스크립트로 만들어진 다양한 한수들의 집합).
- 제이쿼리에서 개선된 사항
1) 호환성 문제점 해결
- 자바스크립트는 호환성(크로스 브라우징)이 떨어짐.
- 자바스크립트에서는 이벤트 객체를 생성할 때 IE 브라우저 8 이하 버전과 그 외의 브라우저(파이어폭스, 크롬, 사파리, 오페라, IE 9 이상 버전)는 코드를 실행했을 때 그 결과에 많은 차이가 있었음.
- 제이쿼리에서는 이 문제들을 모두 해결함.
2) 쉽고 편리한 애니메이션 효과 기능 구현
- 자바스크립트로 애니메이션 효과를 구현하려면 많은 코드를 사용해야 했고, 개발하는 데도 많은 시간이 들었음.
- 제이쿼리는 애니메이션을 쉽게 구현할 수 있고, 다양한 효과(Effect)를 지원하는 메서드를 제공함.
* 제이쿼리 라이브러리 연동하기
- http://jquery.com/ 에 접속한 후 Download the compressed, production jQuery 다운로드.
cf) production jQuery : 코드에 줄 바꿈이 없으며, 주석이 달려있지 않은 압축용 파일. 제이쿼리를 이용하기 위한 개발자에게 필요한 파일.
development jQuery : 코드에 줄 바꿈이 있으며, 주석이 달려 있는 비압축용 파일. 제이쿼리 코드를 개발하기 위한 개발자에게 필요한 파일.
* 제이쿼리 라이브러리 파일 불러오기
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35 |
<!-- 라이브러리 다운로드 방식 -->
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html"; charset="utf-8" />
<title>new document</title>
<script type="text/javascript" src="js/jqeury-1.10.2.min.js(다운로드 받은 jQuery.js 파일 이름)"></script>
</head>
<!-- 제이쿼리 최신 버전에서 삭제된 이전 버전의 메서드 사용하기 -->
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html"; charset="utf-8" />
<title>new document</title>
<script type="text/javascript" src="js/jqeury-1.10.2.min.js(다운로드 받은 jQuery.js 파일 이름)"></script>
<script type="text/javascript" src="js/jqeury-1.2.1.min.js(다운로드 받은 jQuery.js 파일 이름(최신 버전)"></script>
</head>
<!-- 네트워크 전송 방식(CDN) -->
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html"; charset="utf-8" />
<title>new document</title>
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
</head> |
cs |
1) JQuery CDN
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="http://code.jquery.com/jquery-latest.js"></script> (최신 버전)
2) Google CDN
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
3) Microsoft CDN
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery.1.10.2.min.js"></script>
내용 출처 : Do It! 자바스크립트+제이쿼리 입문 (정인용 지음, 이지스퍼블리싱)
'Programming > jQuery' 카테고리의 다른 글
객체 조작 메서드 - 수치 조작 메서드 (0) | 2017.05.22 |
---|---|
객체 조작 메서드 - 속성 조작 메서드 (0) | 2017.05.22 |
선택자와 함께 사용하면 편리한 메서드들 (0) | 2017.05.22 |
탐색 선택자 - 콘텐츠 탐색 선택자 (0) | 2017.05.22 |
탐색 선택자 - 속성 탐색 선택자 (0) | 2017.05.22 |
탐색 선택자 - 위치 탐색 선택자 (0) | 2017.05.22 |
직접 선택자와 인접 관계 선택자 (0) | 2017.05.22 |
선택자 (Selector) (0) | 2017.05.22 |