17 [JQuery(제이쿼리)]

■■■ JQuery(제이쿼리) ■■■

○ 개요

   - jQuery 는 빠르고 간결한 Javascript Library
   - HTML Document traversing, 이벤트 처리, 애니메이션,
     AJAX 를 단순화 하여 빠른 웹 개발을 가능하게 한다.
   - CSS 규격 지원 : CSS 1 ~ 3 와 기본 XPath 지원.
   - 다양한 브라우저 지원.
   - 경량 파일(약 90kb 수준의 파일 크기)
   - John Resig 에 의해 개발.

   ( * 자바스크립트 모든 내용 구현 ←(상호호환)→ jQuery)
   ( * 같은 기능을 수행하더라도 jQuery의 코드는 상당히 짧다)


○ jQuery 를 사용함으로써 얻을 수 있는 장점
  
   - HTML 과 DOM, CSS 의 변경이 간편하다.
   - 이벤트 처리가 간편하다.
   - 애니메이션과 같은 각종 효과를 적용하기 쉽다.
   - AJAX, JSON 과 같은 처리가 간편하다.
   - 브라우저 호환성을 해결할 수 있다.


○ jQuery 다운로드 및 라이브러리 포함

   - jQuery 다운로드
     http://jquery.com/

   - jQuery 를 사용하기 위한 라이브러리 포함
     1. 로컬 PC 저장소에 물리적으로 존재할 때
        (즉, 제이쿼리 파일을 다운로드 받은 경우,
        특정 디렉터리 안에 들어있을 때 그 경로까지 지정해 주어야 한다.)
        <script type="text/javascript" src="jquery-x.x.x.js"></script>
 
    2. CDN 으로 직접 경로 지정
       <script type="text/javascript" src="http://code.jquery.com/jquery.x.x.x.js"></script>

   - jQuery UI 를 사용하기 위한 CSS 및 라이브러리 포함
     <link rel="stylesheet" href="jquery-ui.css"></link>
     <script type="text/javascript" src="jquery-x.x.x.js"></script>
     <script type="text/javascript" src="jquery-ui-x.x.x.custohttp://m.min.js"></script>
     또는
     <link rel="stylesheet" href="http://code.jquery.com/ui/....css"></link>
     <script type="text/javascript" src="http://code.jquery.com/....js"></script>
     <script type="text/javascript" src="http://code.jquery.com/...-ui.js"></script>

○ jQuery 의 사용 방법(2가지)

   1. http://jquery.com/ 에서 파일을 다운로드하여 사용하는 방법
      ※ 다운로드 받을 수 있는 종류
         - 『production』 버전 
            : 소스를 압축(불필요한 공백 및 개행 제거)해서
              웹 서버에서 빠르게 실행할 수 있도록 경량화/최소화 한 버전.
         - 『development』 버전
            : 테스트나 디버깅 또는 코드에 대한 분석을 위해
              압축을 하지 않고 가독성을 높여놓은 버전.
              (공백 및 개행 처리가 되어 있음.)

   ( * CDN : 네트워크를 통해서 라이브러리를 배달받아서 쓰는 방법 )
   2. CDN(Content Delivery Network) 을 통해 사용하는 방법
      별도의 파일을 다운로드 받을 필요 없이
      『<script type="text/javascript"
                 src="http://code.jquery.com/jquery-x.x.x.js"></script>』
      와 같은 구문을 통해 참조하여 포함시킨다.

○ jQuery 참조 및 학습 사이트
   - http://try.jquery.com/
   - http://learn.jquery.com/
   - http://www.w3schools.com/jquery/