Javascript & JQuery & CSS > JSON파일 읽어오기2 - 구조가 다른 문자열 읽기
등록일 : 2017-07-14 17:05
조회수 : 94,438
.post()와 비슷하다.
.ajax()메서드의 단축표기이며, 몇 가지 매개변수가 셋팅된 것이다.
아래 소스를 테스트 해 보삼.
data.asp 파일내용
-------------------------------------
{"counter1":"1",
"content1":[{ "Num":"1", "Name":"홍길동" },
{ "Num":"2", "Name":"백두산" }],
"content2":[{ "Num":"1", "Name":"홍길동" },
{ "Num":"2", "Name":"백두산" }],
"counter2":"2"
}
--------------------------------------------
test.html 파일내용
---------------------------------------------
$(document).ready(function(){
ajaxOptions = {
url: '/test/data.asp',
category_id: 'A01',
cnt: '20',
area_code: '',
page: '1'
};
$("#abcde").click(function(){
$.ajax( {
type: "POST",
url: ajaxOptions.url,
dataType : 'json',
data : ajaxOptions,
success : Whensuccess,
error : WhenError
});
function Whensuccess(xml)
{
alert(xml.counter1);
$.each(xml.content1, function(index, type) {
alert(" "+ type.Name + " ");
});
$.each(xml.content2, function(index, type) {
alert(" "+ type.Name + " ");
});
alert(xml.counter2);
}
function WhenError(xhr, textStatus, errorThrown)
{
alert(errorThrown);
}
});
});
counter1 : 1
counter2 : 2
content1 :[
{ "Num":"1", "Name":"홍길동"},
{ "Num":"2", "Name":"백두산"}
]
content2 :[
{ "Num":"1", "Name":"홍길동"},
{ "Num":"2", "Name":"백두산"}
]
위와 같이 구조가 다른 JSON 파일이 존재합니다.
이런경우 data.asp 파일에 위와 같은 형태로 저장해 둡니다.
ajax() 을 이용해 JSON 파일을 읽을 경우, xml.counter1 , xml.counter2 처럼 읽을 수 있으며,
문자열 JSON 의 경우에는
$.each(xml.content1, function(index, type) {
alert(" "+ type.Name + " ");
});
$.each(xml.content2, function(index, type) {
alert(" "+ type.Name + " ");
});
와 같은 형태로 읽어오면 되겠습니다.