jQuery - 제이쿼리 기초

자바스크립트는 브라우저 간에 호환성이 떨어져 크로스 브라우징이 어렵고, 쓰는 양이 많습니다. 자바스크립트는 분명 많은 일을 합니다. 그렇지만 HTML과 CSS 로는 한계가 있어서 그 이상을 만들고 싶을 때 자바스크립트를 사용합니다.

하지만 단순한 기능을 넣고 싶을 뿐인데, 방대한 코드를 작성해야 하는 경우가 생깁니다. 예를 들어, 어떤 요소의 테두리에 색상을 넣고 싶을 뿐인데, 많은 양의 코드가 작성되어야 합니다.

그래서 제이쿼리를 사용합니다. 제이쿼리는 이러한 문제를 해결해주는 멋진 도구임에 분명합니다. 많은 양을 작성해야 하는 상황에 단 한 줄로 표현할 수 있기 때문입니다.

제이쿼리를 이용하면 HTML 조작은 물론 이벤트 처리, 애니메이션, Ajax 를 훨씬 간단하게 해줍니다. 그래서 더욱 각광받고 있지요.

제이쿼리는 CSS 에서 사용되는 선택자를 이용하기 때문에 조작이 훨씬 수월합니다.

제이쿼리 계열

제이쿼리는 크게 세 가지 버전으로 나눌 수 있습니다. 1.x 2.x 3.x 버전은 사실 기능은 동일하지만 굳이 따지자면 2.x 3.x 버전은 IE 6, 7, 8을 지원하지 않는데 있습니다.

따라서 1.x 버전을 쓰는 편이 좋을 것이라 생각할 수 있지만 상위 버전은 기능이 향상되어 있기 때문에 최신 버전을 이용하는 편이 훨씬 좋습니다.

제이쿼리는 http://jquery.com/download/ 에서 다운로드 받을 수 있습니다. 파일도 비압축 버전과 압축 버전이 있는데, 기능을 동일하며 어느 것을 사용해도 무방합니다.

제이쿼리 연동

jQuery 를 직접 다운로드 받아 설치하거나 CDN 을 이용해 연동시킬 수 있습니다. CDN 은 https://cdnjs.com/libraries/jquery/ 에서 버전 별로 얻을 수 있습니다.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>

제이쿼리는 자주 업그레이드되기 때문에 최신 버전을 이용하다 보면 이전 버전에 작성된 코드와 이후에 작성된 코드의 호환성에 문제가 생길 수 있고, 잘 사용되던 기능이 작동하지 않을 때가 있습니다.

그래서 이와 같은 문제를 해결하기 위해 jQuery Migrate를 사용합니다. 마이그레이트를 설치하려면 제이쿼리를 먼저 기술하고 그 뒤에 마이그레이트를 삽입합니다.

마이그레이트는 jQuery 홈페이지에서 다운로드 받거나 https://cdnjs.com/libraries/jquery-migrate/ 에서 버전에 맞는 CDN 을 사용합니다.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-migrate/1.4.1/jquery-migrate.min.js"></script>