패키지

jQuery란, jQuery 플러그인 삽입하기 본문

Client-Side/XML, Ajax, jQuery

jQuery란, jQuery 플러그인 삽입하기

업단업업 2017. 12. 1. 01:21


jQuery ?!

1) javascript의 생산성을 향상시켜주는 자바스크립트 라이브러리*. jQuery를 이용하면 순수한 자바스크립트로 코딩하는 것보다 10배 이상의 생산성을 높힐 수 있다.

2) DOM*을 내부에 감추고 보다 쉽게 웹페이지를 조작할 수 있도록 돕는 도구이다. jQuery라이브러리*는 DOM의 요소나 요소집합에 빠르고 쉽게 접근할 수 있게 해준다는 장점이 있다.


jQuery를 사용하기위해서는 jquery.js, jquery.min.js라는 문서가 필요하다. 

jQuery를 html에 넣기 위한 두 가지 방법이 있다.

1. jQuery.com 에서 다운받아 자신의 서버에 업로드 하기.

2. jQeury 의 최신 버전을 삽입하기 위해 구글이 호스팅 하는 CDN을 사용하기.

jQuery 홈페이지에서 다운로드 받아 자신의 서버에 업로드 할 수 있다. 하지만 신규버전이 나올때마다 문서를 교체해서 업그레이드 해야하는 불편함이 있기 때문에 CDN* 이라는 것을 사용한다. CDN 이란 다른서버에 있는 jQuery 문서를 url을 통해 불러와서 사용하는 것을 말한다.


jQuery를 사용하기 위해서는 jQuery를 HTML로 로드해야 한다. 

아래와 같이 jQuery를 로드하여 사용한다.

1
2
3
4
5
6
7
8
9
10
11
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script
<!-- 위의 코드를 실행시키면서 jQuery를 로드시킨다. -->
<script>
/* 인라인 스크립트 부분 */
$(document).ready(function(){
    /* 아래의 jQuery실행 내용 :     실제 코딩하는 부분 */ 
    alert('Hello World !!!');
});
</script>
</body>
</html>
cs


아래 결과 화면!


<용어정리>

DOM : Document Object Model (문서객체모델)

라이브러리 : 자주 사용하는 로직을 재사용할 수 있도록 고안된 소프트웨어. 라이브러리를 사용함으로서 훨씬 더 적은코드로 많은 일을 할 수 있다. (유지보수와 가독성, 편의성이 올라간다.)

CDN(Content Delivery Network) : 접속자가 인터넷상에서 가장 가까운 곳의 서버로 컨텐츠를 전송받아 트래픽이 특정 서버에 집중되지 않고 각 서버로 분산되도록 하는 기술.


참조 : 오픈튜토리얼즈, http://blog.work6.kr/70, 

'Client-Side > XML, Ajax, jQuery' 카테고리의 다른 글

jQuery - each() 메서드  (0) 2017.12.11
jQuery 래퍼(wrapper), 선택자(selector)기본  (0) 2017.12.05
Comments