HTML5怎么读取json文件

html-css020

HTML5怎么读取json文件,第1张

严格来说应该是js,建议使用jq框架

$(selector).getJSON(url,data,success(data,status,xhr))

参数描述

url    必需。规定将请求发送到哪个 URL。  

data    可选。规定发送到服务器的数据。  

success(data,status,xhr)    可选。规定当请求成功时运行的函数。

额外的参数:

data - 包含从服务器返回的数据

status - 包含请求的状态("success"、"notmodified"、"error"、"timeout"、"parsererror")

xhr - 包含 XMLHttpRequest 对象

demo_ajax_json文件:

{

"firstName": "Bill",

"lastName": "Gates",

"age": 60

}

$.getJSON("demo_ajax_json.js",function(result){

$.each(result, function(i, field){

$("div").append(field + " ")

})

})

执行函数后,输出结果 Bill Gates 60

HTML5中可以通过localStorage数据与JSON对象的转换,快速实现存储更多数据的功能。

将localStorage数据转成JSON对象,需要调用JSON对象的parse()方法,JSON.parse(data)。其中data就是localStorage对象获取的数据,调用该方法将返回一个装载data数据的JSON对象。

通过stringify()方法,将一个实体对象转换为JSON格式的文本数据,JSON.stringify(obj)。obj表示任意一个实体对象,该方法返回一个由实体对象转成JSON格式的文本数据集。

下例所示:

function addStu(){

var sno=$$("sno").value,

name=$$("name").value,

sex=$$("sex").value,

score=$$("score").value

//声明一个实体对象,将学生的信息当作对象的成员

var

dataSet=new Object

dataSet.sno=sno

dataSet.name=name

dataSet.sex=sex

dataSet.score=score

//把dataSet这个对象转换成JSON格式的文本数据

var

list=JSON.stringify(dataSet)

localStorage.setItem(sno,list)

getlocalData()

}

function getlocalData(){

var addInfo=""

for(var i=0i

var key=localStorage.key(i)

//把json格式的字符串转换成JSON对象

var

dataSet=JSON.parse(localStorage.getItem(key))

addInfo+="

"+dataSet.sno

+""+dataSet.name

+""+dataSet.sex

+""+dataSet.score

+""

$$("allInfo").innerHTML=addInfo

}

}