【总结整理】json数据请求简化版理解（祺哥的成果）

在同源js目录下新建.txt文件

{
  "news":[
    {"title":"审计管理","time":"2018-03-10 21:00"},
    {"title":"菜单管理","time":"2018-03-10 21:00"},
    {"title":"订单管理","time":"2018-03-10 21:00"},
    {"title":"合同管理","time":"2018-03-10 21:00"},
    {"title":"物流管理","time":"2018-03-10 21:00"},
    {"title":"行政管理","time":"2018-03-10 21:00"},
    {"title":"人事管理","time":"2018-03-10 21:00"},
    {"title":"购物管理","time":"2018-03-10 21:00"},
    {"title":"批发管理","time":"2018-03-10 21:00"},
    {"title":"安全管理","time":"2018-03-10 21:00"},
    {"title":"账号管理","time":"2018-03-10 21:00"},
    {"title":"财务管理","time":"2018-03-10 21:00"},
    {"title":"其他管理","time":"2018-03-10 21:00"}
  ]
}
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>news</title>
        <link rel="stylesheet" href="css/index.css" />
        <script src="js/jquery.js"></script>
        <script>
            $(document).ready(function(){
                  var result = $.ajax({
                      url:"./newsData.txt",
                      async:false,
                      dataType: "json"
                  });
                  result = $.parseJSON(result.responseText);//转换为JSON格式
                  var news = result.news;
                  var htmlObj = '';
                  for(var i=0;i<news.length;i++){    //循环生成列表
                      htmlObj += '<li class="newsItem">'+news[i].title+'<span>'+news[i].time+'</span></li>';
                  }
                  $('.newsList').html(htmlObj);    //替换html里的内容
            });
        </script>
    </head>
    <body>
        <h2>News</h2>
        <ul class="newsList">
            
        </ul>
    </body>
</html>

js只有单线程

同步：等接口数据返回完了再往下一行一行执行

异步：放着这个请求先不管，往下执行

js单线程，一行一行往下执行（同步），但是如果请求接口，接口返回数据会延迟，

这个时候如果用异步，就能避免等待太久，直接执行下面的代码

但是他先执行下面代码的时候 需要数据咋办呢  接口还没给数据的时候？

所以，就有回调函数这个说法

回调函数就是你异步请求完数据之后要做的事

你在回调函数里就能写你拿到数据之后要做的事了

 

posted @ 2018-03-10 22:54  coael  阅读(303)  评论(0)  编辑  收藏  举报