제이쿼리 :: 기본
- 자바스크립트 라이브러리이다.
- 라이브러리란 편리하게 사용할 수 있는 객체, 함수 들의 집합이라고 생각하면 된다.
* CDN(Content) : 콘텐츠를 효율적으로 전달하기 위해 전 세계 여러 지점의 서버에 파일을 저장해두고, 사용자와 가까운 지역에서 해당 파일(콘텐츠)을 제공해주는 네트워크 시스템을 의미합니다.
1. 개요
- jQuery는 모든 브라우저에서 동작하는 클라이언트 자바스크립트 라이브러리이다.(2006년 1월 존 레식)
* 문서 객체 모델과 관련된 처리를 쉽게 구현
* 일관된 이벤트 연결을 쉽게 구현
* 시각적 효과를 쉽게 구현
* Ajax 애플리케이션을 쉽게 개발
- 제이쿼리로 시각적 효과를 구현하면 플래시()와 실버라이트()를 작동하지 앟는 아이폰, 아이패드 같은 장치에서도 작동합니다.
- 제이쿼리 2.X 버전까지는 익스 8까지 지원이 되지만, 제이쿼리 3.X 버전부터는 익스8이하의 버전 지원을 중단했습니다. 만약 익스 8 이하를 지원해야 한다면 제이쿼리 1.2.X버전을 사용해야 합니다.
- 제이쿼리는 CDN호스트를 사용하는 방법(http://code.jquery.com/)과 직접 내려받아 사용하는 방법 2가지가 있습니다.
- ex)
<script src="http://code.jquery.com/jquery-2.2.4.js"
integrity="sha256-iT6Q9iMJYuQiMWNd9lDyBUStIq/8PuOW33aOqmvFpqI=" crossorigin="anonymous"></script>
여기서 integrity와 crossorigin은 SRI해시라고 부르며, 스크립트를 사용한 공격을 막기 위한 용도로 사용합니다.
2. $(document).ready()
- $(document).ready()는 문서가 준비되면 매개변수로 넣은 콜백 함수를 실행하라는 의미입니다. jQuery는 이벤트 메서드 중 하나입니다.
(매개변수란 함수호출시 함수객체로 넘겨질 인자값들을 담기 위해 함수명세에서 선언된 변수들을 뜻한다.
인자(Argument)는 어떤 함수를 호출시에 전잘되는 값을 말한다.
매개 형식 변수(Parameter)는 그 전달된 인자를 받아들이는 변수다.)
- $(document).ready()는 window.onload = function(){ }; 과 비슷한 기능을 수행합니다.
- 제이쿼리 이벤트 메서드는 표준 이벤트 모델이나 인터넷 익스플로러 이벤트 모델과 마찬가지로 이벤트로 여러 개의 함수를 연결할 수 있습니다.
- $(document).ready( function(){}); 는 간단하게 $(function(){ }); 으로도 씁니다.
★ $는 무엇인가?
- 자바 스크립트에서 식별자로 사용할 수 있는 특수 기호는 $와 _입니다. 여기서 $를 식별자로 사용했을 뿐입니다. jQuery의 코드를 보면 다음과 같은 부분이 있습니다.
- window.jQuery = window.$ = jQuery;
- jQuery 식별자를 $로 대체했을 뿐입니다. 따라서 $식별자가 아니라 jQuery 식별자를 사용해도 됩니다. 하지만 많이 사용하는 식별자이므로 쉽게 $를 사용하는 것이 일반적입니다.
2-1. 제이쿼리와 스크립트의 관계?
- 자바스크립트의 onload와 같은 기능. (문서의 모든 콘텐츠(images, script, css, etc)가 로드된 후 발생하는 이벤트이다.)
- html은 위에서 아래로 순서대로 기능한다.
- 위 -> 아래 -> 스크립트 onload의 순서
- 일반적으로, 스크립트를 문서의 마지막(</body>) 이전에 삽입하면 굳이 이벤트를 이용하여 프로그래밍을 처리할 필요가 없다. 다만, 문서의 <head> 영역에 스크립트가 삽입되거나 외부의 파일에 정의되어 있다면 이벤트를 연결하여 문서의 로드시점에 맞에 처리해야 한다.
참고사이트 : http://webdir.tistory.com/515
--------------------------------------------------------------------------------------------------------------------------------------------
PLUS. 스크립트가 왜 필요한가??
- html은 문서 구조르 다루는 언어이다. 그리고 css는 html요소가 어디에 자리 잡을지, 어떻게 보일지 조절합니다. html과 css는 웹 페이지가 어떻게 만들어지고 어떻게 보일지는 정하지만, 어떻게 행동할지는 정하지 않습니다. 그래서 스크립트 언어가 필요합니다. 다시 말해 jQuery가 필요한 것입니다.
'Web > jquery' 카테고리의 다른 글
| [제이쿼리] .each() / .filter() / .find() _170816 (0) | 2018.05.15 |
|---|---|
| [제이쿼리] each,find,filter _20170814 (0) | 2018.05.15 |
| [제이쿼리] 선택자 예제20170809 (0) | 2018.05.15 |
| [제이쿼리] 선택자 (0) | 2018.05.15 |
| [제이쿼리] eq (0) | 2018.05.15 |