jsonp原理:
动态创建一个script标签,然后在全局声明一个函数用来接收数据。
用处：解决主流浏览器不能进行跨域数据访问的问题。
依据:由于同源策略，一般来说位于 server1.example.com 的网页无法与不是 server1.example.com的服务器沟通，而 HTML 的<script> 元素是一个例外。利用 <script> 元素的这个开放策略，网页可以得到从其他来源动态产生的 JSON 资料，而这种使用模式就是所谓的 JSONP。用 JSONP 抓到的资料并不是 JSON，而是任意的JavaScript，用 JavaScript 直译器执行而不是用 JSON 解析器解析。
以下是实现在自己新建的页面,利用ajax和jsonp模拟百度的搜索下拉菜单.
https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd=1&cb=show这个是百度搜索API接口
代码部分如下:
<script type="text/javascript">
$(function(){
var oInput=$('input');
var oUl=$('ul');
oInput.keyup(function(){
var str=oInput.val();
$.ajax({
url:'https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su',
data:{
wd:str
},
dataType:'jsonp',
jsonp:'cb',
success:function(res){
oUl.html();
$.each(res.s,function(){
oUl.append($('<li>'+this+'</li>'));
})
}
})
})
})
</script>
<body>
<input type="text" name="search">
<ul>
</ul>
</body>
