ajax 기본구조

제가 초반 부터 설명을 드릴려고 했던것이 post 방식을 이용한 ajax 호출이었기 때문에 예문을 들어 설명을 하도록 하겠다.

 

$.ajax({   type: "POST",   url: "/testpost.jsp",   dataType: "json",   data: "svalue=text&tvalue=test2",   success: function(msg){   alert( "Data : " + msg );   }  });

 

위의 구문을 보면 상당히 간단하다.

 

type : get, post

url : 호출할 url 주소

datayType : xml, json, script, html

data : 위의 예문처럼 get 방식의 =,&의 기호를 이용하여 쌍을 위루어 데이터를 만들어서 넘겨도 되고 json 처럼 key,value의 형태인 array로 넘겨도 된다. ({"key":"value","key2":"value2"})

success : ajax호출이 성공했을때 결과를 호출할수 있다. 위와 같이 내부 fuction을 선언해서 처리해도 되고, 호출할 js function 명을 써 놔도 된다.

jQuery 에서 ajax를 호출할때 위와 같이 간단한 구문을 이용하면 성공적으로 구현이 가능하다.

만약 jQuery처럼 js 프레임웍을 사용하지 않는다면 모든 브라우저마다 분기처리를 해서 다 확인을 하여야 한다.

 

그럼 이러써 간단하게 jQuery를 이용하여 ajax POST방식을 알아 보았다.