由于浏览器有同源策略,所以要想获取非同源(协议,域名,端口三者有一不同都算非同源)的页面的数据,就得进行跨域
由于脚本标签的src属性可以访问非同源的js脚本,所以通过src属性访问服务器会返回函数的js代码,而我们想要的数据就作为函数参数返回,而我们会先定义这个函数,返回的js代码就可执行
请求页面
& lt; !DOCTYPE html>
& lt; html>
& lt; head>
& lt; title> & lt;/title>
& lt;/head>
& lt; body>
& lt;脚本type=" text/javascript祝辞
函数jsonp(数据){
console.log(用户名)
｝
& lt;/script>
& lt;脚本type=" text/javascript " src=" https://www.yisu.com/zixun/jquery-1.8.3.min.js "比;
& lt;/script>
& lt;脚本type=" text/javascript祝辞
$(文档)时函数(){
var url=" http://www.example.com/jsonp.php& # 63;调=jsonp”;
脚本var=$ (' & lt; script> & lt; \/script>”);
script.attr (" src "、url);
$(“身体”).append(脚本);
}）;
& lt;/script>
& lt;/body>
& lt;/html>
& lt; & # 63; php
$ data=https://www.yisu.com/zixun/{“名称”:“张三'};
美元调=$ _GET(“回调”);
调元回声。”(“.json_encode ($ data)”。)”;
& # 63;php>
之后php会返回
jsonp ({
名称:“niuni
})
然后PHP返回的代码h会被请求页面的jsonp方法执行
& lt; script>
函数showData(数据){
console.info(数据);
｝
美元(文档)。准备好(函数(){
$ (" # btn”)。点击(函数(){
. ajax({美元
url:“http://www.example.comjsonp”,
类型:“获得”,
数据类型:“jsonp ",//返回数据类型
jsonpCallback:“showData ",//回调函数//获取数据成功就执行成功函数
成功:功能(数据){
console.info(“数据”);
｝
}）;
}）;
}）;
& lt;/script>
以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对的支持。
