Javscript ? jQuery? jQuery !
본문 바로가기

Interests [관심사]/Jquery & Javascript

Javscript ? jQuery? jQuery !

jQuery 란 무엇인가?

우선은 HTML, CSS, Javascript에 대해 알아봅시다.


What is the jQuery ?

First, let's figure out about the HTML, CSS, Javascript.




우리가 매일 접속하는 웹사이트는 크게 3가지 요소로 구성된다. ‘HTML(Hyper Text Markup Language)’, ‘CSS(Cascading Style Sheets)’, ‘자바스크립트(Javascript)’다. HTML은 웹페이지의 큰 뼈대를 제공하고, CSS는 색깔이나 글씨체와 같은 디자인 요소를 관리한다. 자바스크립트는 크로스 플랫폼(cross platform), 객체지향 스크립트 언어로 웹페이지의 동작을 담당한다. 예를 들어 자바스크립트를 이용하면 ‘버튼을 클릭하면 밑에 날짜를 보여줘’라는 식의 명령을 내릴 수 있다.

[네이버 지식백과] 자바스크립트 [Javascript] - 웹을 풍부하게 만들어주는 작고 가벼운 언어 (용어로 보는 IT)


사람으로 따지면 HTML 은 사람의 골격, 뼈대를 담당하고 CSS 는 헤어스타일, 옷, 화장, 악세사리 등을 담당한다. 

그리고 Javscript와 jQuery는 사람의 동작을 담당한다고 생각하면 되겠다. 예를들면 팔을 올린다던지 눈 깜빡이기, 말하기 등등 ~~


※ 참고로 java 와 javascript는 전혀 관계가 없다 ^^ 언어를 만든 사람부터 기능과 사용법까지 완전히 다르다 !!! 

어떤사람이 말하길.. 자바와 자바스크립트의 관계는 햄과 햄스터와 같다고.. 그만큼 완전 다르다는 말 !


On the person side, HTML means skeleton and CSS means hair style, dress, makeup.

JavaScript and jQuery mean blinking, talking, or clapping the human eye.

And... You should know, Java and Javascript are completely unrelated.




그렇다면 jQuery? 란?

Finaly we getting closer to the point. What is the jQuery?


jQuery(제이쿼리)는 HTML의 클라이언트 사이드 조작을 단순화 하도록 설계된 크로스 플랫폼의 자바스크립트 라이브러리다. 존 레식이 2006년 뉴욕 시 바캠프(Barcamp NYC)에서 공식적으로 소개하였다. jQuery는 오늘날 가장 인기있는 자바스크립트 라이브러리 중 하나이다.

[위키백과] https://ko.wikipedia.org/wiki/JQuery


jQuery is a cross-platform JavaScript library designed to simplify the client-side scripting of HTML.[3] It is free, open-source software using the permissive MIT License.[2] Web analysis indicates that it is the most widely deployed JavaScript library by a large margin.

[WIKIPEDIA] https://en.wikipedia.org/wiki/JQuery



쉽게말해 jQuery는  javscript 보다 더 쉽고 편리하게 사용하기위해 개발된 라이브러리 이다.

Simplereation, jQuery is a library developed for easier and more convenient use then javascript.


예를들어본다면 어떤 대상을 선택할때 javscript 와 jQuery 간의 차이를 알 수있다. 아래와 같이 jQuery 가 javscript 보다 더 간단하다.

For example, If you want select some object you can see the diffrence beween javscript and jQuery.

As you can see, jQuery is more simplely then javscript.


//javascript
dcument.getElementById("아이디");
document.querySelector('#foo').classList.add('active');

//jQuery
$("#id");
$('#foo').addClass('active')


대신 라이브러리를 사용하는 것이므로, 다음과같이 버전에 맞는 js 파일을 추가해야 한다.

보통 <head>와 </head>사이에 선언한다.

But this is library so, you must use the js file provided on the jQuery website.

Usually declare between <head></head>


* jQuery 홈페이지에서 직접 js파일을 가져오는경우와 js 파일을 로컬에 다운받아서 파일을 가져오는 경우

*  You can use the js file 2 way like this. Import from website or after download and use as a local file.


<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="resources/js/jquery-3.2.1.min.js"></script>


Jquery 홈페이지에서 API 와 함께 여러가지 버전의 jQuery 라이브러리를 제공하고 있다.

You can get the latest version of jQuery and API from this website.


https://jquery.com/