在同源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单线程,一行一行往下执行(同步),但是如果请求接口,接口返回数据会延迟,

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

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

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

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

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

【总结整理】json数据请求简化版理解(祺哥的成果)的更多相关文章

  1. XML 数据请求与JSON 数据请求

    (1)XML 数据请求 使用 AFNetworking 中的 AFHTTPRequestOperation 和 AFXMLParserResponseSerializer,另外结合第三方框架 XMLD ...

  2. 使用 AFNetworking 进行 XML 和 JSON 数据请求

    (1)XML 数据请求 使用 AFNetworking 中的 AFHTTPRequestOperation 和 AFXMLParserResponseSerializer,另外结合第三方框架 XMLD ...

  3. 关于跨域读取json数据我的理解

    这两天在做关于读取json数据的插件,想用getJSON读取数据: $.getJSON(http://www.xxxx.com/Titles.js, function (data) { console ...

  4. ajax数据请求的理解

    一,请求 发送请求有两种方式:get 跟 post . 1.get仅请求数据,不需要服务端做处理,最后会返回指定的资源. 2.post可以提交数据,服务端根据提交的数据做处理,再返回数据. 二,创建X ...

  5. springmvc学习笔记(18)-json数据交互

    springmvc学习笔记(18)-json数据交互 标签: springmvc springmvc学习笔记18-json数据交互 springmvc进行json交互 环境准备 加入json转换的依赖 ...

  6. Django之AJAX传输JSON数据

    目录 Django之AJAX传输JSON数据 AJAX 中 JSON 数据传输: django响应JSON类型数据: django 响应 JSON 类型数据: Django之AJAX传输JSON数据 ...

  7. AJAX 跨域请求 - JSONP获取JSON数据

    Asynchronous JavaScript and XML (Ajax ) 是驱动新一代 Web 站点(流行术语为 Web 2.0 站点)的关键技术.Ajax 允许在不干扰 Web 应用程序的显示 ...

  8. AJAX 跨域请求的解决办法:使用 JSONP获取JSON数据

    由于受到浏览器的限制,ajax不允许跨域通信.如果尝试从不同的域请求数据,会出现安全错误.如果能控制数据驻留的远程服务器并且每个请求都前往同一域,就可以避免这些安全错误.但是,如果仅停留在自己的服务器 ...

  9. 【转】AJAX 跨域请求 - JSONP获取JSON数据

    来源:http://justcoding.iteye.com/blog/1366102/ Asynchronous JavaScript and XML (Ajax ) 是驱动新一代 Web 站点(流 ...

随机推荐

  1. vs plug

    工欲善其事,必先利其器.尽管visual studio本身已经非常强大,但优秀的插件仍然可以帮开发者大大提高效率,以下是牛牛非常喜欢的vs插件. 1.Indent Guides 绝对是必须的,有了这些 ...

  2. 最实用的 Linux 命令行使用技巧

    我们可能每天都会要使用到很多的 Linux 命令行. 我们也会网络上知晓一些使用它们的小技巧,但是如果我们没有时常来进行练习,就有可能会忘掉怎么去使用它们. 所以我就决定把那些你可能会忘记的小提示和小 ...

  3. lightoj1422 区间dp

    对于这一题想了很久真的是一点头绪也没有,还有组数明明是200,数据范围100,O(n^3)的复杂度居然不会爆掉(可能是因为一直在想怎么用O(n^2)的复杂度做这题 做法是先预处理dp,对于dp[i][ ...

  4. WCF最简单的一次通信(有部分參考,多爲原創)

    不廢話,直接上乾貨 1.先创建一个wcf服务库,是服务类库,远程的lib 2.全部按照默认设置,不修改.然后点发布,会出现一个wcf测试客户端,可以看有没有发布成功. 3.msdn的wcf教程还要求输 ...

  5. levelDB, TokuDB, BDB等kv存储引擎性能对比——wiredtree, wiredLSM,LMDB读写很强啊

    在:http://www.lmdb.tech/bench/inmem/ 2. Small Data Set Using the laptop we generate a database with 2 ...

  6. BW ON HANA 业务模型关系与数据取数

    在接到业务需求之后,我认为重要的是理清楚自己该做什么.来实现业务.由于不了解业务,还是走了很多弯路.本可以不用这么做,还是这么做了.自然你最傻瓜的按照用户的方式去实现是没有问题的. 会使后面的人难以维 ...

  7. GCD多线程的使用

    转载自http://blog.csdn.net/nono_love_lilith/article/details/7829557 写得非常好 1.下面来看下如何使用gcd编程的异步 dispatch_ ...

  8. C++中声明和定义的区别

    声明 这有一个与这个名字相关的东西,并且它是这个类型的,告诉编译器我要使用它,并期待它定义在某一个地方. 定义 定义是指提供所有必要的信息(占用内存大小),使其能够创建整个实体. 我们必须明白的: 一 ...

  9. input 标签中的checkd 添加与取消

    //获取是否选中 var isChecked = $('#cb').prop('checked'); //或 var isChecked = $('#cb').is(":checked&qu ...

  10. [转]实现微信浏览器内打开App Store链接

    微信浏览器是不支持打开App Store 页面的,不知道微信为什么这么做.比如你页面写 <a href=”http://itunes.apple.com/us/app/id399608199″& ...