jQuery AJAX get() 요청 방식과 post()의 요청방식 둘다 사용 가능합니다.
jQuery get() 은 기본적으로 서버로부터 데이터를 가져오는데 사용됩니다.
jQuery post() 은 서버로부터 일부 데이터를 가져옵니다.
jQuery get()
$.get(URL,callback); 기본사용 문법
$("button").click(function(){
$.get("test.php",function(data,status){
alert("Data: " + data + "\nStatus: " + status);
});
});
// test.php 의 내용을 읽어들입니다.
test.php 의 내용은
---------------------------------------
<?
echo "이 내용은 php 내용입니다.";
?>
---------------------------------------
jQuery get() 관련예제
<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$.get("test.php",function(data,status){
alert("Data: " + data + "\nStatus: " + status);
});
});
});
</script>
</head>
<body>
<button>get() 버튼</button>
</body>
</html>
// "get() 버튼"을 클릭하면 위 그림처럼 test.php의 내용을 가져옵니다. function(data, status) 의 값은 임의의 변수 입니다. 하지만 founction에 임의의 변수값을 선언하면 가져올때도 같은 변수값을 사용해야 합니다. 만약 값이 틀릴경우 스크립트 오류가 발생합니다.
jQuery post()
$.post(URL,data,callback); 기본사용 문법
$("button").click(function(){
$.post("test_post.php",
{
name:"Donald Duck",
city:"Duckburg"
},
function(data,status){
alert("Data: " + data + "\nStatus: " + status);
});
});
// test_post.php 의 내용을 읽어들입니다.
test_post.php 의 내용은
---------------------------------------
<?
$fname = $_POST["name"];
$thank = $_POST["thank"];
echo "이 블로그는 " . $fname . " 입니다.";
echo "많은 방문에 " . $thank . ".";
?>
---------------------------------------
jQuery post() 관련예제
<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$.post("test_post.php",
{
name:"Park's의 블로그",
thank:"감사드립니다"
},
function(data,status){
alert("Data: " + data + "\nStatus: " + status);
});
});
});
</script>
</head>
<body>
<button>post() 버튼</button>
</body>
</html>
// 위 그림을 보면 어떻게 데이터가 이동했는지 알 수 있습니다.
일단 소스에서 보시면 name 값에 "Park's의 블로그", thank 값에 "감사드립니다" 의 내용이 들어가 있습니다.
그냥 변수값에 담겨졌다고 생각하면 이해하기 쉬울듯 합니다. 아래 function 구문은 위의 get() 과 동일합니다.
그리고 test_post.php 에서 $_POST["name"], $_POST["thank"] 이렇게 넘어온값을 받아옵니다.
그래서 그 값을 대입한 결과 위 그림처럼 메시지가 나타나게 되는 것입니다.
이제 어느정도 이해가 가나요? get() 방식은 그냥 데이터를 가져오기만 하지만 post() 방식은 데이터를 주고받을 수 있습니다.
실무에서 굉장히 많이 쓰이는 부분입니다. 위 내용은 기본 내용입니다. 응용하다 보면 더 고급 프로그래밍을 제작할 수 있습니다.
여기까지 jQuery AJAX 였습니다. jQuery 관련 블로그 포스팅을 하면서 저도 다시 공부하는 느낌이네요 ㅎㅎ
이글을 보시는 분들께 많은 도움이 되길 바라며, 모든 프로그래머분들 화이팅 하시기 바랍니다.
'jQuery > jQuery AJAX' 카테고리의 다른 글
| jQuery AJAX load() (2) | 2013.05.27 |
|---|---|
| jQuery AJAX 소개 (0) | 2013.05.25 |
