제이쿼리(jQuery) 기초문법
제이쿼리(jQuery)
제이쿼리는 자바스크립트를 더 쉽게 사용하기 위해 만들어진 자바스크립트 라이브러리 언어다. 라이브러리 언어란 자바스크립트로 만들어진 다양한 함수들의 집합을 가리킨다.
제이쿼리는 이런 다양한 함수들을 사용자에게 제공함으로써 간편하게 사용할 수 있도록 개선했다. 개선된 사항은 아래와 같다.
1) 호환성 문제 해결
자바스크립트의 문서 객체 모델과 이벤트 객체는 호환성(크로스 브라우징)이 떨어진다는 단점이 있다. 문서 객체 선택자의 호환성 문제가 제이쿼리에서는 모두 해결이 되었다.
2) 쉽고 편리한 애니메이션 효과 기능 구현
애니메이션과 다양한 효과를 지원하는 메소드를 제공하는 제이쿼리는 자바스크립트보다 훨씬 개발시간을 많이 단축할 수 있다.
제이쿼리 라이브러리 연동
제이쿼리를 연동하는 방법에는 다운로드(Download) 방식과 네트워크 전송(CDN, Content Delivery Network)방식이 있다.
- 다운로드 방식 : 제이쿼리 라이브러리를 제공하는 사이트에서 제이쿼리 라이브러리 파일을 직접 내려받아 HTML에 불러오는 방식. 네트워크 상태와 상관없이 언제든 개발할 수 있다. 하지만 컴퓨터에 라이브러리 파일을 내려받아야 한다. (제이쿼리:: https://jquery.com/download/)
- 네트워크 전송 방식(CDN) : 온라인에서 제공하는 제이쿼리 라이브러리 파일을 네트워크를 통해 HTML에 불러오는 방식. 간편하게 연동할 수 있다. (CDNJS :: https://cdnjs.com/libraries/jquery)
라이브러리 파일 차이
| 종류 | 설명 |
| jquery.js | 소스에 들여쓰기, 줄 바꿈, 주석까지 정리된 비압축 파일로 제이쿼리 자체를 개발할 때 유용 |
| jquery.min.js | 소스에 들여쓰기, 줄 바꿈, 주석이 무시된 압축 파일로 소스가 압축되어 있어 제이쿼리 자체를 개발하는 용도로는 적합하지 않지만 용량이 작아 로딩 속도가 빠르다. |
제이쿼리 최신 버전에서 삭제된 이전 버전의 메소드 사용하기
제이쿼리는 최신버전으로 자주 업그레이드 하기 때문에 이전버전에서 자주 사용했던 기능(메소드)이 삭제되어 사용할 수 없는 경우가 있다. 이런 경우 최신버전에서 삭제된 이전 버전(1.9미만)의 기능을 사용하기 위해 'Migrate plugin'을 설치하면 된다.
https://jquery.com/download/에서 [Download the compressed, production jQuery Migrate 1.4.1]을 클릭한 후 'js'폴더에 내려받아 HTML의 제이쿼리 최신 버전의 라이브러리 파일을 연동한 태그 다음 부분에 내려받은 [jquery Migrate 1.4.1]파일을 연동한다.
<head>
<meta charset = "UTF-8">
<title>제이쿼리 연동</title>
<script src="js/jquery.js"></script>//다운로드 방식
<script src="js/jquery-migrate-1.4.1.min.js"></script>
//네트워크 전송(CDN) 방식
<script src="https://cdnjs.cloudflare.com/aja/libs/jquery/1.12.4/jquery.js"></script>
//항상 최신 버전 CDN
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
</head>
'언어공부 > JavaScript&jQuery' 카테고리의 다른 글
| 제이쿼리(jQuery) 기초 문법 - 선택자 (2) 직접 선택자, 메소드 체이닝 기법 (0) | 2021.08.01 |
|---|---|
| 제이쿼리(jQuery) 기초 문법 - 선택자 (1) 기본 선택자 종류 (0) | 2021.07.31 |
| 자바 스크립트(JavaScript) 기초 문법 - 함수(3) (0) | 2021.07.29 |
| 자바 스크립트(JavaScript) 기초 문법 - 함수(2) (0) | 2021.07.28 |
| 자바 스크립트(JavaScript) 기초 문법 - 함수(1) (0) | 2021.07.27 |