首先来说,AJAX垮与需要考虑2个问题:
1.Ajax交换数据的格式
2.Ajax跨域的需求如何解决
目前较为流行的处理方式就是:将要交换的数据设置成JSON(javascript原生支持)格式,然后使用JSONP跨域。
但是请明白一点AJAX和JSONP完全是两种东西,ajax使用的是xmlhttprequest,而JSONP利用的<script>标签。
JSON就不详细说了,可以理解为一段javascript片段,
**********************以下来自百度解释JSON**************************************
json简单说就是javascript中的对象和数组,所以这两种结构就是对象和数组两种结构,通过这两种结构可以表示各种复杂的结构
1、对象:对象在js中表示为“{}”括起来的内容,数据结构为 {key:value,key:value,...}的键值对的结构,在面向对象的语言中,key为对象的属性,value为对应的属性值,所以很容易理解,取值方法为 对象.key 获取属性值,这个属性值的类型可以是 数字、字符串、数组、对象几种。
2、数组:数组在js中是中括号“[]”括起来的内容,数据结构为 [”java“,"javascript","vb",...],取值方式和所有语言中一样,使用索引获取,字段值的类型可以是 数字、字符串、数组、对象几种。
***************************百度解释完毕********************************************
like this:
- varjsonObj={
- "objName":"JSONNAME",
- "objType":[{"default":"object"},{"setType":"JSON"}]
- }
其中大括号内,包含大括号这一段就是JSON,当前这个JSON我将它赋值给jsonObj,在冒号前面的值就可以理解为jsonObj的属性,
假设我要获取objName对应的值,跟JS写法一样,”对象.属性“获取值,类似这么写jsonObj.objName,对应的值就是JSONNAME,这个在下文中会有使用。
接下来进入正题,JSONP
对于AJAX来说,无法请求直接请求普通文件,但是,在web项目中,对于JS脚本、img等一些文件,我们可以通过src标签引用到页面上,同时,
JSON既是一种数据格式,有可以理解为一段js片段,那我们是不是可以综合起来,通过前台向后台发请求,然后后台给返回一段json格式的代码呢
没错,这就是JSONP。
设定模拟环境
1.假设环境为远程服务器名为jsonptest.com
2.静态html为jsonptest.html
3.远程服务器根目录下有jsonptest.js文件
A.我们模拟一个html引用JS,然后在JS中调用页面的方法的过程: