jQuery ajax讀取本地json文件的實例
json文件
{ "first":[ {"name":"張三","sex":"男"}, {"name":"李四","sex":"男"}, {"name":"王武","sex":"男"}, {"name":"李梅","sex":"女"} ] }
js:
方法一:
$.ajax({ url: "ceshi.json",//json文件位置 type: "GET",//請求方式為get dataType: "json", //返回數(shù)據(jù)格式為json success: function(data) {//請求成功完成后要執(zhí)行的方法 //each循環(huán) 使用$.each方法遍歷返回的數(shù)據(jù)date $.each(data.first, function(i, item) { var str = '<div>姓名:' + item.name + '性別:' + item.sex + '</div>'; document.write(str); }) } })
方法二:
jQuery.getJSON()是jQuery.ajax()函數(shù)的簡寫形式
// jQuery.getJSON( url [, data ] [, success ] ) $.getJSON("ceshi.json", "", function(data) { //each循環(huán) 使用$.each方法遍歷返回的數(shù)據(jù)date $.each(data.first, function(i, item) { var str = '<div>姓名:' + item.name + '性別:' + item.sex + '</div>'; document.write(str); }) });
以上這篇jQuery ajax讀取本地json文件的實例就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
ASP.NET jQuery 實例7 通過jQuery來獲取DropDownList的Text/Value屬性值
這節(jié)我們將通過jQuery來獲取DropDownList的Text/Value屬性值,需要的朋友可以參考下2012-02-02jQuery插件Validate實現(xiàn)自定義表單驗證
這篇文章主要介紹了jQuery插件Validate實現(xiàn)自定義表單驗證,自定義一個驗證方法,感興趣的小伙伴們可以參考一下2016-01-01jQuery 順便學(xué)習(xí)下CSS選擇器 奇偶匹配nth-child(even)
今天學(xué)習(xí)jQuery,看到nth-child(even)用法,特意找了下這個選擇器的用法,在CSS3標(biāo)準(zhǔn)中,用法很強(qiáng)大。2010-05-05跟著JQuery API學(xué)Jquery 之二 屬性
在選擇器的API學(xué)習(xí)中,走馬觀花的把選擇器過了一遍,但是選擇歸選擇,選擇出來了沒干什么事,也沒有什么用嘛2010-04-04jQuery插件實現(xiàn)非常實用的tab欄切換功能【案例】
這篇文章主要介紹了jQuery插件實現(xiàn)非常實用的tab欄切換功能,涉及jQuery事件響應(yīng)及頁面元素屬性動態(tài)操作相關(guān)實現(xiàn)技巧,需要的朋友可以參考下2019-02-02一款Jquery 分頁插件的改造方法(服務(wù)器端分頁)
分頁幾乎是每個外部程序必不可少的東西,在webform時代很多人都用過AspNetPager這個用戶控件吧,用的人之多其實就在于它的優(yōu)點2011-07-07