欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

jQuery使用getJSON方法獲取json數(shù)據(jù)完整示例

 更新時間：2016年09月13日 14:22:23   作者：onestopweb  
這篇文章主要介紹了jQuery使用getJSON方法獲取json數(shù)據(jù),結(jié)合完整實例形式分析了getJSON方法讀取與遍歷json文件數(shù)據(jù)的相關(guān)技巧,需要的朋友可以參考下

本文實例講述了jQuery使用getJSON方法獲取json數(shù)據(jù)。分享給大家供大家參考，具體如下：

demo.js：

[
  {
    "name":"吳者然",
    "sex":"男",
    "email":"demo1@123.com"
  },
  {
    "name":"吳中者",
    "sex":"男",
    "email":"demo2@123.com"
  },
  {
    "name":"何開",
    "sex":"女",
    "email":"demo3@123.com"
  }
]

demo.html：

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>getJSON獲取數(shù)據(jù)</title>
<script type="text/javascript" src="js/jquery-1.10.1.min.js"></script>
<style type="text/css">
#divframe {
  border: 1px solid #999;
  width: 500px;
  margin: 0 auto;
}
.loadTitle {
  background: #CCC;
  height: 30px;
}
</style>
<script type="text/javascript">
$(function(){
  $("#btn").click(function(){
    $.getJSON("js/demo.js",function(data){
      var $jsontip = $("#jsonTip");
      var strHtml = "123";//存儲數(shù)據(jù)的變量
      $jsontip.empty();//清空內(nèi)容
      $.each(data,function(infoIndex,info){
        strHtml += "姓名："+info["name"]+"<br>";
        strHtml += "性別："+info["sex"]+"<br>";
        strHtml += "郵箱："+info["email"]+"<br>";
        strHtml += "<hr>"
      })
      $jsontip.html(strHtml);//顯示處理后的數(shù)據(jù)
    })
  })
})
</script>
</head>
<body>
<div id="divframe">
  <div class="loadTitle">
    <input type="button" value="獲取數(shù)據(jù)" id="btn"/>
  </div>
  <div id="jsonTip"> </div>
</div>
</body>
</html>

效果圖如下：

這里把 JSON 的后綴名改為 JS，放在 WEB 容器中則可以正常讀取。

PS：這里再為大家推薦幾款json在線工具，相信大家在今后的開發(fā)中可以用得到：

在線JSON代碼檢驗、檢驗、美化、格式化工具：
http://tools.jb51.net/code/json

JSON在線格式化工具：
http://tools.jb51.net/code/jsonformat

在線XML/JSON互相轉(zhuǎn)換工具：
http://tools.jb51.net/code/xmljson

json代碼在線格式化/美化/壓縮/編輯/轉(zhuǎn)換工具：
http://tools.jb51.net/code/jsoncodeformat

C語言風(fēng)格/HTML/CSS/json代碼格式化美化工具：
http://tools.jb51.net/code/ccode_html_css_json

更多關(guān)于jQuery相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《jQuery操作json數(shù)據(jù)技巧匯總》、《jQuery擴展技巧總結(jié)》、《jQuery常用插件及用法總結(jié)》、《jQuery拖拽特效與技巧總結(jié)》、《jQuery表格(table)操作技巧匯總》、《jquery中Ajax用法總結(jié)》、《jQuery常見經(jīng)典特效匯總》、《jQuery動畫與特效用法總結(jié)》及《jquery選擇器用法總結(jié)》

希望本文所述對大家jQuery程序設(shè)計有所幫助。

相關(guān)文章

最新評論