json:
data.json:
{
"code":1,
"data":
{
"name": "kid",
"age":18
}
}
导入json数据:
<script type="text/javascript"> $.ajax({ url:'js/data.json', //数据不要求很安全,小型数据用get type:'get', dataType:'json' }) .done(function (data) { if(data.code==1){ $('.user_welcome em').html(data.data.name); $('.user_welcome').show(); $('.user_login_link').hide(); } }) .fail(function () { alert('哎呀,好像网不好~'); }); </script>
json是JavaScript Object Nation 的首字母缩写,单词的意思是javascript对象表示法,这里说的json指的是类似于javascript对象的一种数据格式,目前这种数据格式比较流行,逐渐替换掉了传统的xml数据格式。
与json对象不同的是,json数据格式的属性名称需要用双引号引起来,用单引号或不用引号会导致读取数据错误。
ajax:
ajax技术的目的是让javascript发送http请求,与后台通信,获取数据和信息。
ajax技术的原理是实例化xmlhttp对象,使用此对象与后台通信。ajax通信的过程不会影响后续javascript的执行,从而实现异步。
局部刷新:ajax可以实现局部刷新,也叫做无刷新,无刷新指的是整个页面不刷新,只局部刷新。ajax可以自己发送http请求,不用通过地址栏,所以整个页面不会刷新,ajax获取到后台数据,更新页面显示数据的部分,就做到了页面局部刷新。
同源策略:
Node.js是一个Javascript运行环境(runtime environment)
jsonp:
ajax只能请求同一个域下的数据或资源,有时候需要跨域请求数据,就需要jsonp技术。
jsonp的原理如下:
<script type="text/javascript" src="....../js/data.js"><script>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>ajax text</title> <script type="text/javascript" src="jquery-1.12.4.min.js"></script> <script type="text/javascript"> $.ajax({ url:'data.js', type:'get', dataType:'jsonp', jsonpCallback:'aa' }) .done(function (data) { alert(data); }) .fail(function () { console.log("error"); }) </script> <script type="text/javascript" src="data.js"></script> </head> <body> </body> </html>
data.js:
aa({"name":"tom"})