讀取server端json資料，
以上一筆，下一筆顯示資料(下載school.json)
(要用chrome才能查詢到json資料)

(1).讀取server端json資料：

function loadjson() {
var xmlhttp = new XMLHttpRequest();
var url = "json/school.json";
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
jsonDoc = JSON.parse(xmlhttp.responseText);
changedata(0); }
}
xmlhttp.open("GET", url, true);
xmlhttp.send();
}

(2).jsonDoc就是object物件陣列

(3).步驟3：以上一筆，下一筆顯示資料

步驟1:建立next()函數來控制到下一筆

function next()
{
i++;
if(i>jsonDoc.length){i=0;}
changedata(i);
}

步驟2:建立previous()函數來控制到下一筆

function previous()
{
i--;
if(i<0){i=jsonDoc.length-1;}
changedata(i);
}

步驟3:建立顯示單筆資料的changedata(i)

var jsonDoc;
var i=0;
function changedata(i)
{
str ="學校: " + jsonDoc[i].name;
str +="<br/>住址: " + jsonDoc[i].address;
str +="<br/>電話: " + jsonDoc[i].tel;
str +="<br/>網址: " + jsonDoc[i].ip;
document.getElementById("id01").innerHTML = str;
}

(4)..school.json內容

[
{"ip":"http://www.tsu.edu.tw/","name":"台灣首府大學","address":"台南市麻豆區南勢里168號","tel":"06-5718888","pic":"icon80_80/image01.jpg"},
{"ip":"http://web.ncku.edu.tw/","name":"成功大學","address":"臺南市東區大學路1號","tel":"06-2757575","pic":"icon80_80/image02.jpg"},
{"ip":"http://www.nutn.edu.tw/","name":"台南大學","address":"台南市中西區樹林街二段33號","tel":"06-2133111","pic":"icon80_80/image03.jpg"},
{"ip":"http://www.feu.edu.tw/","name":"遠東科大","address":"台南市新市區中華路49號 ","tel":"06-5979566","pic":"icon80_80/image04.jpg"},
{"ip":"http://www.ksu.edu.tw/","name":"崑山科大","address":"台南市永康區崑大路 195 號","tel":"06-2727175","pic":"icon80_80/image05.jpg"},
{"ip":"http://www.stust.edu.tw/","name":"南台科大","address":" 台南市永康區南台街一號","tel":"06-2533131","pic":"icon80_80/image06.jpg"}
]