편집토론기록

jQuery

jQuery는 자바스크립트를 좀 더 간결하게 사용할 수 있게 만드는 일종의 전처리기(Preprocessor)이며 자체적으로 독립된 프로그래밍 언어는 아니다.

특징[편집 | 원본 편집]

브라우저에 의존적이지 않음[편집 | 원본 편집]

간결한 문법[편집 | 원본 편집]

DOM 자바스크립트는 id 선택자는 document.getElementById('(id명)'), 태그 선택자는 document.getElementsByTagName('(태그명)')등으로 파편화되어 있다. 그러나 jQuery에서는 간단하게 $('(쿼리명)').(명령어)형태로 지정할 수 있다.

예를 들면 div 태그 안에 클릭해서 특정 웹사이트로 연결하는 기능을 추가하고 싶을 땐 바닐라 자바스크립트에서는 

// 우선 선택하기. ECMA6부터는 document.querySelector('#id-example')으로도 선택 가능.
idn = document.getElementById('id-example');
idn.onclick = function () {(동작)};

이것을 jQuery에서는 보다 더 간결하게 정의할 수 있다. 

$('#id-example').click(function(){ (동작)});

사용방법[편집 | 원본 편집]

우선 HTML 페이지에서 jQuery를 사용할 때에는 jQuery 다운로드 페이지에서 직접 자바스크립트 파일을 다운로드 받을 수 있다. 그 다음에 <body> 태그 아래 안쪽에는 다음과 같은 스크립트를 집어넣는다. 

<script type="text/javascript" src="(상대경로)/jquery-3.5.1-min.js"/>

아니면 다음과 같은 코드를 body 태그 안쪽 맨 아래에 입력해도 상관없다. 다만 이 경우는 인터넷이 연결되지 않으면 jQuery 코드를 사용할 수 없다. 

<script type="text/javascript" src="https://code.jquery.com/jquery-3.5.1.min.js"/>

미디어위키에서[편집 | 원본 편집]

미디어위키는 기본적으로 jQuery를 사용할 수 있다. 미디어위키:Common.js나 사용자 자바스크립트 문서에서도 사용가능하다. 실제로 도움말:사용자 자바스크립트의 일부 예제들도 jQuery 문법을 사용한 객체들을 볼 수 있다.

jQuery Mobile[편집 | 원본 편집]

jQuery를 활용한 모바일 호환 웹 프레임워크이다. 이쪽은 단순한 전처리기가 아닌 부트스트랩처럼 CSS 디자인 기능도 제공하는 종합적인 프레임워크이다.

참조[편집 | 원본 편집]

각주