728x90
항상 사용되는 ajax 모양
<script>
var v_ajax = new XMLHttpRequest();
v_ajax.open("메소드", "URL", true);
v_ajax.send("전달값: get방식일때 비워두거나 null을 씀");
v_ajax.onreadystatechange = function () {
if (v_ajax.readyState == 4 && v_ajax.status == 200) {
// 받은 데이터 처리
v_ajax.responseText;
}
}
</script>
JSON을 이용하여 바뀌는 부분만 일반화
<script>
var $ = {};
$.ajax = function (p_json) {
var v_ajax = new XMLHttpRequest();
v_ajax.open(p_json.method, p_json.url, true);
v_ajax.send();
v_ajax.onreadystatechange = function () {
if (v_ajax.readyState == 4 && v_ajax.status == 200) {
// 제이슨에는 메소드를 붙을 수 있음
p_json.success(v_ajax.responseText);
}
}
}
</script>
사용
1) 제이쿼리AJAX
<script>
$.ajax({
"method": "get"
, "url": "data.csv"
, "success": function (p_data) {
alert("넘겨받은 값은: " + p_data + "입니다.");
}
});
$.ajax({
"method": "get"
, "url": "test.php"
, "success": function (p_data) {
alert("넘겨받은 값은: " + p_data + "입니다.");
}
});
</script>
2) 스크립트AJAX
간단히 간단히 사용
var p_data = {};
p_data.method = "get";
p_data.url = "data.csv";
p_data.success = function (p_msg) {
alert("넘겨받은 값은: " + p_msg);
}
$.ajax(p_data);
더보기
<!DOCTYPE html>
<meta charset="UTF-8">
<script>
/* // 아래 항상쓰는 aj?ax모양
var v_ajax = new XMLHttpRequest();
v_ajax.open("메소드", "URL", true);
v_ajax.send("전달값: get방식일때 비워두거나 null을 씀");
v_ajax.onreadystatechange = function () {
if (v_ajax.readyState == 4 && v_ajax.status == 200) {
// 받은 데이터 처리
v_ajax.responseText;
}
} */
// 바뀌는 부분만 일반화를 시키자(JSON이용)
// _와 $는 변수명으로 쓸 수 있음
var $ = {};
$.ajax = function (p_json) {
var v_ajax = new XMLHttpRequest();
v_ajax.open(p_json.method, p_json.url, true);
v_ajax.send();
v_ajax.onreadystatechange = function () {
if (v_ajax.readyState == 4 && v_ajax.status == 200) {
// 제이슨에는 메소드를 붙을 수 있음
p_json.success(v_ajax.responseText);
}
}
}
// 만들었으니 확인!
var p_data = {};
p_data.method = "get";
p_data.url = "data.csv";
p_data.success = function (p_msg) {
alert("넘겨받은 값은: " + p_msg);
}
$.ajax(p_data);
$.ajax({
"method": "get"
, "url": "data.csv"
, "success": function (p_data) {
alert("넘겨받은 값은: " + p_data + "입니다.");
}
});
$.ajax({
"method": "get"
, "url": "test.php"
, "success": function (p_data) {
alert("넘겨받은 값은: " + p_data + "입니다.");
}
});
</script>
'AJAX' 카테고리의 다른 글
AJAX 우회해서 네이버 가져오기 (0) | 2020.08.04 |
---|---|
AJAX예제 (0) | 2020.08.03 |
AJAX(Asynchronous Javascript And Xml) (0) | 2020.08.03 |