博客

jquery中的$.ajax()函数，除了可以发起真正的Ajax数据请求之外，还可以发起JSONP数据请求，例如：

 $.ajax({
            url: 'http://www.liulongbin.top:3006/api/jsonp?name=zs&age=20',
            dataType: 'jsonp',
            success: function (res) {
                console.log(res);
            }
        })

默认情况下，使用Jquery发起JSONP请求，会自动携带一个callback=jQueryxxx的参数，jQueryxxx是随机生成的一个回调函数的名称。

在jquery中如果想要自定义Jquery的回调函数名称及JSONP的参数，可通过以下两个参数来指定：

 $.ajax({
            url: 'http://www.liulongbin.top:3006/api/jsonp?name=zs&age=20',
            dataType: 'jsonp',
            jsonp: 'callback', //自定义参数的名称  一般让它默认为callback 不会做修改
            jsonpCallback: 'abc',   //自定义回调函数的名称
            success: function (res) {
                console.log(res);
            }
        })

jquery中JSONP的实现过程：

jquery中的jsonp也是通过script标签的src属性来实现跨域数据访问的，只不过，jquery采用的是

动态创建和移除script标签

的方式，来发起JSONP数据请求。

在

发起JSONP请求的时候

，动态向<header>中append一个script标签；

在

JSONP请求成功以后

，动态地移除刚刚append进去的script标签。