• Q&A
  • 회원가입
  • 로그인

[AJAX] JQ - $.get() 메서드 ★ - AJAX HTTP GET방식으로 서버에서 데이터 로드 (= 아작스겟메서드)

목차

  1. $.get() 예제 
  2. $.get() 요청 예제
  3. $.get() 구문

 

$.get() 예제 

 

<!doctype html>

<html lang="ko">

<head>

<meta charset="utf-8">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script>

$(document).ready(function(){

    $("button").click(function(){

        $.get("test.txt", function(data, status){

            alert("데이터: " + data + "\n상태: " + status);

        });

    });

});

</script>

</head>

<body>


<button>HTTP GET 방식 요청을 페이지로 보내서 결과 돌려받기</button>


</body>

</html>

 

※ data : test.txt 파일에 적힌 내용

※ status : 통신 상태  (성공 시 success) 

 

$.get() 요청 예제

 

"test.txt"를 요청하지만 반환 결과는 무시.

$.get("test.txt"); 

 

"test.txt"를 요청하고 요청과 함께 추가 데이터 보내기 (반환 결과 무시).

$.get("test.txt", { name:"홈짱닷컴", domain:"Homzzang.com" }); 

 

"test.txt"를 요청하고 데이터 배열을 서버에 전달 (반환 결과 무시).

$.get("test.txt", { 'study[]' : ["HTML","CSS","JS"] });


"test.txt"를 요청하고 요청 결과 보기

$.get("test.txt", function(data){

  alert("데이터: " + data);

});

 

$.get() 구문

 

$.get(URL,data,function(data,status,xhr),dataType)

 


[매개변수]

 

URL 

필수. 요청할 URL을 지정.

 

data
선택. 요청과 함께 서버에 보낼 데이터를 지정.

 

function(data, status, xhr

선택. 요청이 성공할 경우 실행할 함수를 지정.


data

요청의 결과 데이터를 포함.

 

status

요청 상태. 

※ 가능한 종류: 

"success", 

"notmodified", 

"error", 

"timeout" , 

"parsererror"

 

xhr

XMLHttpRequest 객체를 포함.

 

dataType 

선택. 서버 응답에 필요한 데이터 유형을 지정.

기본적으로 jQuery는 자동 추측을 수행. 

※ 가능 데이터 유형 :

"xml"- XML 문서

"html"- HTML을 일반 텍스트로 사용

"text"- 일반 텍스트 문자열

"script"- 응답을 JavaScript로 실행하고 일반 텍스트로 반환.

"json"- 응답을 JSON으로 실행하고 JavaScript 객체를 반환.

"jsonp"- JSONP를 사용하여 JSON 블록에 로드.  "? 콜백 =?" URL에 콜백함수 지정. 

 


오늘도 즐겁게 열심히 .....

찾아주셔서 감사합니다. Since 2012