jQuery.getJSON()

 

설명 : GET HTTP 요청을 사용하여 서버에서 JSON 인코딩 데이터를로드합니다.

이것은 Ajax 함수의 약자로 다음과 같습니다 :

$.ajax({
  dataType: "json",
  url: url,
  data: data,
  success: success
});

서버로 전송 된 데이터는 URL에 쿼리 문자열로 추가됩니다. data매개 변수 의 값이 일반 객체이면 URL에 추가되기 전에 문자열로 변환되고 URL 인코딩됩니다.

대부분의 구현은 성공 처리기를 지정합니다.

$.getJSON( "ajax/test.json", function( data ) {
  var items = [];
  $.each( data, function( key, val ) {
    items.push( "<li id='" + key + "'>" + val + "</li>" );
  });
 
  $( "<ul/>", {
    "class": "my-new-list",
    html: items.join( "" )
  }).appendTo( "body" );
});
이 예제는 물론 JSON 파일의 구조에 의존합니다.

{
  "one": "Singular sensation",
  "two": "Beady little eyes",
  "three": "Little birds pitch by my doorstep"
}

이 구조체를 사용하여 예제는 요청 된 데이터를 반복하고 순서가없는 목록을 작성한 다음 본문에 추가합니다.

success콜백은 JSON 구조에 의해 정의되고 사용 파싱 전형적 자바 스크립트 객체 또는 배열 반환 데이터 전달 $.parseJSON()방법. 응답의 텍스트 상태도 전달됩니다.

jQuery를 1.5로서 상기 success콜백 함수는 수신 "jqXHR"개체 (에 jQuery를 1.4 , 그 수신 XMLHttpRequest개체). JSONP와 도메인 간 GET 요청을 사용하지 않는 때문에, XHR을 , 그 경우에 jqXHR및 textStatus성공 콜백에 전달 된 매개 변수는 정의되지 않습니다.

중요 : jQuery 1.4에서 JSON 파일에 구문 오류가있는 경우 요청은 일반적으로 자동으로 실패합니다. 이러한 이유로 JSON 데이터를 자주 손으로 편집하지 마십시오. JSON은 JavaScript의 객체 리터럴 표기법보다 엄격한 구문 규칙을 사용하는 데이터 교환 형식입니다. 예를 들어, JSON에 표시된 모든 문자열은 속성이든 값이든간에 큰 따옴표로 묶어야합니다. JSON 형식에 대한 자세한 내용은 http://json.org/을 참조하십시오 .

JSONP
URL에 "callback =?"문자열이 포함 된 경우 (또는 서버 측 API에서 정의한 것과 유사한) 요청은 대신 JSONP로 처리됩니다. 자세한 내용은 jsonp데이터 유형에 $.ajax()대한 설명을 참조하십시오.

jqXHR 오브젝트
jQuery 1.5 부터 모든 jQuery의 Ajax 메소드는 XMLHTTPRequest객체 의 상위 집합을 반환한다 . 이 jQuery XHR 객체 또는 "jqXHR" $.getJSON()은 Promise 인터페이스 를 구현하고 Promise의 모든 속성, 메서드 및 동작을 제공합니다 ( 자세한 내용 은 Deferred 객체 참조 ). jqXHR.done()(성공) jqXHR.fail()(에러) 및 jqXHR.always()(완료 성공 또는 오류 여부; 1.6 jQuery를 첨가)의 방법은 요청이 종료 될 때 호출되는 함수 인수를 사용. 이 함수가받는 인수에 대한 자세한 내용은 설명서 의 jqXHR 객체 절을 참조하십시오 $.ajax().

jQuery를 1.5에서 약속 인터페이스도 포함 jQuery의 아약스 방법을 허용 $.getJSON()체인 배수로, .done(), .always(), 및 .fail()단일 요청에 콜백하고, 요청이 완료 수도 후에도 이러한 콜백을 할당합니다. 요청이 이미 완료되면 즉시 콜백이 시작됩니다.

// Assign handlers immediately after making the request,
// and remember the jqxhr object for this request
var jqxhr = $.getJSON( "example.json", function() {
  console.log( "success" );
})
  .done(function() {
    console.log( "second success" );
  })
  .fail(function() {
    console.log( "error" );
  })
  .always(function() {
    console.log( "complete" );
  });
 
// Perform other work here ...
 
// Set another completion function for the request above
jqxhr.complete(function() {
  console.log( "second complete" );
});