先看看获取到的数据:
前端内容ajax 使用jsonp跨域请求方式,理解如下:
JSONP本质: 利用script标签src跨域访问,获得一个回调函数,再利用回调函数参数内容获取返回的数据args
img src 亦可以, Form src会被本地同源策略阻止XMLHttpRequest阻止
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JSONP跨域请求</title>
</head>
<body>
<input type="button" onclick="jsonp1()" value="jsonp跨域请求"></button>
<div id="parent_div">
</div>
<script src="/static/jquery-3.3.1.min.js"></script>
<script>
function jsonp1(){
$.ajax({
url: "http://www.jxntv.cn/data/jmd-jxtv2.html",
type:"GET", //JSONP只能发送get请求,默认GET
data:{uid:1},
dataType:"jsonp",
jsonp:"callback",
//回调函数用list包裹
jsonpCallback:"list"
});
}
//取出包裹到list函数中的值
function list(args){
console.log(args);
console.log(args["data"])
for (var i = 0; i<args["data"].length; i++){
for (var j = 0; j < args["data"][i]["list"].length;j++){
//alert(args["data"][i]["list"][j]["name"])
tar = document.createElement("span");
tar.innerHTML = args["data"][i]["list"][j]["name"];
document.getElementById("parent_div").appendChild(tar);
}
}
//$("#parent_div").html(obj.data)
}
</script>
</body>
</html>
后台views.py数据:
from django.shortcuts import render,HttpResponse
import uuid,os,json
def jsonp(request):
return render(request,"jsonp.html")
本文参考老男孩教学资料,感谢.