jquery getjson 예제

이 예제는 물론 JSON 파일의 구조에 의존합니다: 개체의 일부를 정렬되지 않은 목록으로 변환하는 것 외에도 전체 개체는 브라우저의 디버깅 콘솔에도 인쇄됩니다. 출력은 ID 표시 데이터가 있는

요소에서 생성됩니다. 모든 요청에 대해 요소가 재설정되더라도 결과 JSON 개체에 항목이 전혀 포함된 경우에만 해당 요소가 채워지습니다. 물론, 우리의 예를 들어 데이터는 고정되어 있지만 일반적으로 모든 종류의 응답이 가능합니다. 아래 예제에서는 jQuery의 getJSON() 메서드를 보여 줍니다: 이 구조를 사용 하 여 이 예제는 요청된 데이터를 통해 루프, 정렬 되지 않은 목록을 빌드 하 고 본문에 추가 합니다. 이 구조를 사용하여 예제에서는 파일에서 첫 번째 문자열과 두 번째 번호를 페이지에 삽입합니다. 중요: jQuery 1.4에서 JSON 파일에 구문 오류가 있는 경우 요청은 일반적으로 자동으로 실패합니다. 이러한 이유로 JSON 데이터를 자주 직접 편집하지 마십시오. JSON은 JavaScript의 개체 리터럴 표기법보다 엄격한 구문 규칙이 있는 데이터 교환 형식입니다. 예를 들어 JSON에 표시되는 모든 문자열은 속성이든 값이든 관계없이 큰따옴표로 묶어야 합니다. JSON 형식에 대한 자세한 내용은 https://json.org/ 참조하십시오. 이 예제에서는 다음 데이터가 포함된 artists.txt를 사용합니다. JSON 유효성 검사의 개념을 소개하기 전에 보다 현실적인 예제를 간직해 보겠습니다.

일반적으로 정적 JSON 파일을 요청하지는 않지만 동적으로 생성된 JSON을 로드합니다(예: API 호출의 결과). JSON 생성은 사전에 제공해야 하는 일부 매개 변수에 따라 달라집니다. 가장 큰 질문은 이제 오류가 실제로 전송 된 JSON에 있는지 어떻게 감지합니까? 여기에 플리커 API에서 이미지를 가져 오는 방법을 보여줍니다. 참고 : 우리가 올바른 장소에 자바 스크립트 파일을 포함하고 있기 때문에 (닫기 태그 바로 앞), 이 시점에서 문서가 정의에 따라 준비되기 때문에 더 이상 $(document).ready() 콜백을 사용할 필요가 없습니다. jqXHR.success(), jqXHR.error(및 jqXHR.complete() 콜백 메서드는 jQuery 3.0에서 제거됩니다. 대신 jqXHR.done(), jqXHR.fail(및 jqXHR.always()을 사용할 수 있습니다. . JSON은 텍스트 데이터를 교환하기 위한 사실상의 표준 형식입니다.

jQuery의 $.getJSON () 방법은 JSON 형식의 데이터에 대한 요청과 관련된 거의 모든 시나리오를 처리 할 수있는 좋은 작은 도우미를 제공합니다. 이 문서에서는이 편리한 도우미와 함께 제공되는 몇 가지 방법과 possiblities를 조사했습니다. 정적 JSON 파일을 제공하는 로컬 서버를 시작합니다. 이 파일로 표시되는 개체는 자바스크립트 코드에서 가져오고 처리됩니다. 데모를 위해 Node.js를 사용하여 서버를 제공합니다(모든 서버가 수행하더라도). 이것은 우리가 다음과 같은 세 가지가 필요합니다 의미 : 여기에 할 말이 많지 않다. 공식 웹 페이지에서 jQuery (이전 버전 1.9.1, 확실히 우리의 목적을 위해 충분)의 축소 된 버전을 사용합니다.