<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>JSONP跨域</title>
</head>
<body>
<div>
<button id="btn">点击</button>
</div>
<script>
function handleResponse(responent) {
console.log(responent)
}
</script>
</body>
<script>
window.onload = function () {
let btn = document.getElementById('btn');
btn.addEventListener('click', function () {
var scritpt = document.createElement('script');
scritpt.src = 'https://api.douban.com/v2/book/search?q=javascript&count=1&callback=handleResponse';
document.body.insertBefore(scritpt, document.body.firstChild);
});
}
</script>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>jq-JSONP跨域</title>
<script src="./../../jq/jquery.js"></script>
</head>
<body>
<div>
<button id="btn">点击</button>
</div>
</body>
<script>
$(function () {
$("#btn").on('click', function () {
$.ajax({
async: true,
url: "https://api.douban.com/v2/book/search",
type: "GET",
dataType: 'jsonp', //返回的数据类型,设置成jsonp方式
jsonp: 'callback', // 指定一个参数名称来覆盖默认的jsonp 回调参数名 callback
jsonpCallback: "handleResponse",
data: {
q: "javascript",
count: 1
},
success: function (response, status, xhr) {
console.log(response)
console.log(status)
console.log(xhr)
}
})
})
})
</script>
</html>
https://blog.csdn.net/u014607184/article/details/52027879