jquery遍歷json數組了解 遍歷json數組對象

什么是 JSON?

  • JSON 英文全稱 JavaScript Object Notation
  • JSON 是一種輕量級的數據交換格式 。
  • JSON是獨立的語言 *
  • JSON 易于理解 。
  • json對象使用js語法,但是json字符串僅僅是一個文本 。
  • 文本可以被任何一種編程語言讀取及作為數據格式傳遞 。
JSON 格式化后為 JavaScript 對象JSON 格式在語法上與創建 JavaScript 對象代碼是相同的 。
由于它們很相似,所以 JavaScript 程序可以很容易的將 JSON 數據轉換為 JavaScript 對象 。
  • JSON 語法規則
  • 數據為 鍵/值 對 。
  • 數據由逗號分隔 。
  • 大括號保存對象
  • 方括號保存數組
JSON 數據 – 一個名稱對應一個值
JSON 數據格式為 鍵/值 對,就像 JavaScript 對象屬性 。
鍵/值對包括字段名稱(在雙引號中),后面一個冒號,然后是值:
“name”:”Runoob”
JSON 對象JSON 對象保存在大括號內 。
就像在 JavaScript 中, 對象可以保存多個 鍵/值 對:
{“name”:”Runoob”, “url”:”www.runoob.com”}
JSON 數組JSON 數組保存在中括號內 。
就像在 JavaScript 中, 數組可以包含對象:
“sites”:[ {“name”:”Runoob”, “url”:”www.runoob.com”}, {“name”:”Google”, “url”:”www.google.com”}, {“name”:”Taobao”, “url”:”www.taobao.com”}]
在以上實例中,對象 “sites” 是一個數組,包含了三個對象 。
每個對象為站點的信息(網站名和網站地址) 。
JSON 字符串轉換為 JavaScript 對象通常我們從服務器中讀取 JSON 數據,并在網頁中顯示數據 。
簡單起見,我們網頁中直接設置 JSON 字符串
首先,創建 JavaScript 字符串,字符串為 JSON 格式的數據:
var text = ‘{ “sites” : [‘ +'{ “name”:”Runoob” , “url”:”www.runoob.com” },’ +'{ “name”:”Google” , “url”:”www.google.com” },’ +'{ “name”:”Taobao” , “url”:”www.taobao.com” } ]}’;
然后,使用 JavaScript 內置函數 JSON.parse() 將字符串轉換為 JavaScript 對象:
json語法定義了employees對象;3條員工記錄(對象)的數組:
{“employees”:[
{“firstname”:”john”,”lastname”:”doe”},
{“firstname”:”an”,”lastname”:”smith”},
{“firstname”:”jo”,”lastname”:”e”},
}
二:
var obj = JSON.parse(text);
最后,在你的頁面中使用新的 JavaScript 對象:
實例
var text = ‘{ “sites” : [‘ + ‘{ “name”:”Runoob” , “url”:”www.runoob.com” },’ + ‘{ “name”:”Google” , “url”:”www.google.com” },’ + ‘{ “name”:”Taobao” , “url”:”www.taobao.com” } ]}’; obj = JSON.parse(text);document.getElementById(“demo”).innerHTML = obj.sites[1].name + ” ” + obj.sites[1].url;
<json的遍歷>eval()函數可將字符串轉換為代碼執行,并返回一個或多個值
函數原型:w3c:eval()函數可計算某個字符串,并執行其中的js代碼eval(string)
<!DOCTYPEhtml><html><head><metacharset="UTF-8"><title></title></head><body><script>vardata=https://www.cnfyg.com/shcs/[{"name":"a","age":12},{"name":"b","age":11},{"name":"c","age":13},{"name":"d","age":14}];// for(varoindata){// alert(o);// alert(data[o]);// alert("text:"+data[o].name+"value:"+data[o].age);// }functiontext(){varjson={"employees":[{"firstName":"John","lastName":"Doe"},{"firstName":"Anna","lastName":"Smith"},{"firstName":"Peter","lastName":"Jones"}]}json=eval(json.employees);//json=json.employees;for(vari=0;i<json.length;i++){alert(json[i].firstName+""+json[i].lastName)}}text()varperson={//json "name":'Bob',"age":20,"tags":['js','web','mobile'],"city":'Beijing',"hasCar":true,"zipcode":null};for(varoinperson){alert(o+""+person[o]);//for(vari=0;i<person.length;i++){// alert(person[i].firstName+""+person[i].lastName)// alert(o);// alert(data[o]);}</script></body></html>【jquery遍歷json數組了解 遍歷json數組對象】運行結果以此如下:
jquery遍歷json數組了解 遍歷json數組對象

文章插圖
jquery遍歷json數組了解 遍歷json數組對象

文章插圖
jquery遍歷json數組了解 遍歷json數組對象

文章插圖
jquery遍歷json數組了解 遍歷json數組對象

文章插圖
jquery遍歷json數組了解 遍歷json數組對象

文章插圖
jquery遍歷json數組了解 遍歷json數組對象

文章插圖
jquery遍歷json數組了解 遍歷json數組對象

文章插圖
jquery遍歷json數組了解 遍歷json數組對象

文章插圖
jquery遍歷json數組了解 遍歷json數組對象

文章插圖
jquery遍歷json數組了解 遍歷json數組對象

文章插圖

    推薦閱讀