jQuery 제이쿼리란 무엇입니까 AJAX

jQuery는 AJAX 개발을 위한 풍부한 라이브러리를 제공합니다.

 

 

[AJAX란 무엇인가]

AJAX = Asynchronous JavaScript and XML.

(AJAX = 비동기식 자바스크립트 & XML)

AJAX는 웹페이지를 빠르고 다이나믹하게 만드는 기술입니다.

AJAX는 화면 뒤에서 적은 양의 데이터를 서버와 교환하여 비동기적으로 웹페이지를 업데이트할 수 있게 합니다.

다른 말로 하면, 전체 웹페이지를 새로고침하지 않고 웹페이지의 일부분만을 업데이트하는 것이 가능하다는 얘기입니다.

AJAX에 대해서는 제 블로그에서 기초적인 부분을 다뤘습니다. 참고하세요.

 

 

[AJAX와 jQuery]

jQuery는 AJAX 웹 개발을 할 때 다양한 메서드를 제공합니다.

jQuery AJAX를 사용하면, HTTP Get 방식과 HTTP Post 방식 모두를 사용하여 원격 서버로부터 TXT, HTML, XML, JSON 데이터를 요청할 수 있습니다.

또한 웹페이지에서 선택한 HTML 엘리먼트에 원격데이터를 직접 로드할 수 있습니다!

 

 

[적게 쓰고 많은 일을 한다]

jQuery load() 메서드는 간단한 (하지만 매우 강력한) AJAX 함수입니다.

이 메서드는 다음과 같은 문법으로 사용합니다.

$(selector).load(url,data,callback)

selector는 변경시킬 HTML 엘리먼트를 정의합니다. 그리고 url 변수는 데이터를 가지고 있는 웹 주소를 나타냅니다.

{예제10-1}

서버에 데이터를 보내기만 할 것이라면 data 변수를 사용합니다.

수행이 완료된 후에 어떤 함수를 실행시키려면 callback 변수를 사용합니다.

 

 

[Low Level AJAX]

Low level AJAX 함수의 문법은 $.ajax(options) 로 사용합니다.

$.ajax는 load, get, post와 같은 더 높은 레벨의 함수보다 더 많은 기능을 제공하지만 사용 또한 어렵습니다.

option 변수는 name|value와 같이 한 쌍의 형태로 url, password, 데이터 타입, 필터, 문자열 세트, timeout 및 에러 함수를 정의합니다.

{예제10-2}

 

 

[jQuery AJAX 메소드 정리]

$(selector).load(url,data,callback) → 선택한 엘리먼트에 원격 데이터를 로드시킨다

$.ajax(options) → XMLHttpRequest 오브젝트에 원격 데이터를 로드시킨다

 

 

 

 

 

감사합니다.

출처