ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • [jQuery] 제이쿼리란
    Legacy/Web 2015. 7. 14. 10:18
    728x90

    제이쿼리는 모질라의 자바스크립트 개발자였던 존 레식이 창시하였다. 제이쿼리는 자바스크립트를 이용해 만든 라이브러리 언어이다.

    제이쿼리에서는 자바스크립트의 호환성 문제(IE 8버전 이하와 다른 브라우저)를 해결하였다.

    자바스크립트로 애니메이션 효과를 구현하려면 많은 코드를 사용해야 했고 개발하는 데도 많은 시간이 들었다. 하지만 제이쿼리는 애니메이션을 쉽게구현할 수 있고 다양한 효과를 지원하는 메소드를 제공한다.


    제이쿼리 라이브러리 연동

    제이쿼리를 사용하는 방법은 두 가지가 있다. 첫 번째는 제이쿼리 사이트에 접속해서 제이쿼리 라이브러리 파일을 직접 다운받아 웹 문서에 연동하는 다운로드 방식이고, 두 번째 방법은 온라인에서 제이쿼리 라이브러리 파일을 제공하는 네트워크에서 파일을 연동하여 가져오는 네트워크 전송 방식(CDN:Content Delivery Network)이다.

    다운로드 방식은 다운로드 받아두면 언제나 사용할 수 있다는 장점이 있다. 네트워크 전송 방식은 다운로드 받을 필요는 없다는게 장점이지만 개발자의 컴퓨터가 인터넷에 연결되어 있지 않다면 사용할 수 없다는 단점이 있다. 



    다운로드 방식

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" lang="ko" xml:lang="ko">
        <head>
            <title> new document </title>
            <meta http-equiv="content-type" content="text/html;charset=utf-8" />
            <script type="text/javascript" src="js/jquery-1.11.3.min.js"></script>
        </head>
        <body>
      
        </body>
    </html>
    cs

    6행을 주목


    네트워크 전송 방식

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" lang="ko" xml:lang="ko">
        <head>
            <title> new document </title>
            <meta http-equiv="content-type" content="text/html;charset=utf-8" />
            <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
        </head>
        <body>
      
        </body>
    </html>
    cs

    마찬가지로 6행을 주목하면 된다.

    만약 사용하려는 버전은 잘 모르겠고 최신 버전으로 하고 싶다면 6행의 http://code.jquery.com/jquery-1.11.3.min.js 부분을 다음과 같이 바꾸면 된다.

    http://code.jquery.com/jquery-latest.js


Designed by Tistory.