ajax 跨域解决之JSONP
跨域的问题
域：域名
跨域请求（访问）：一个域名下的文件请求另外一个域名下的资源，就产生了跨域
三种方法：
ajax跨域搜索实例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style>
dl{
border-bottom: 1px solid royalblue;
}
</style>
<script>
function fn1(data){
var oMsg = document.getElementById("msg");
var oList = document.getElementById("lists");
console.log(data);
oMsg.innerHTML = data.title.$t + ':' + data['opensearch:totalResults'].$t;
var oEntry = data.entry;
var html = '';
for(var i=0;i<oEntry.length;i++){
html += '<dl><dt>'+oEntry[i].title.$t+'</dt><dd><img src="'+oEntry[i].link[2]['@href']+'"/></dd></dl>';
}
alert(html);
oList.innerHTML = html;
}
window.onload = function(){
var oQ = document.getElementById("q");
var oBtn = document.getElementById("btn");
var oMsg = document.getElementById("msg");
var oList = document.getElementById("lists");
oBtn.onclick = function(){
if(oQ.value != ''){
//alert(1);
var oScript = document.createElement('script');
oScript.src = 'http://api.douban.com/book/subjects?q='+oQ.value+'&alt=xd&callback=fn1';
document.body.appendChild(oScript);
}
}
}
</script>
</head>
<body>
<input id="q" type="text"/>
<input type="button" id="btn" value="搜索" />
<p id="msg"></p>
<hr />
<div id="list">
</div>
</body>
</html>
这里还有点小问题
分页查找思路：