JSONP：是JSON with padding（填充式JSON或参数式JSON）的简写，它由两部分组成：回调函数和数据。回调函数是当响应到来时应该在页面中调用的函数，回调函数的名字一般是在请求中指定的，而数据就是传入回调函数中的JSON数据
jsonp原理：在资源加载进来之前定义好一个函数，这个函数接收一个参数（数据），函数里面利用这个参数做一些事情，然后需要的时候通过script标签加载对应远程文件资源，当远程的文件资源被加载进来的时候，就会去执行我们前面定义好的函数，并且把这个数据当作这个函数的参数传进去
下面是使用jsonp跨域请求百度数据接口，实现百度搜索下拉菜单的功能。嗯、直接上代码
<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>无标题文档</title><style>#q {width: 300px; height: 30px; padding: 5px; border:1px solid #f90; font-size: 16px;}#ul1 {border:1px solid #f90; width: 310px; margin: 0;padding: 0; display: none;}li a { line-height: 30px; padding: 5px; text-decoration: none; color: black; display: block;}li a:hover{ background: #f90; color: white; }</style><script>function leo(data) {//回调函数var oUl = document.getElementById('ul1');var html = '';if (data.s.length) {//判断是否有数据oUl.style.display = 'block';//有数据让下拉菜单显示出来for (var i=0; i<data.s.length; i++) {html += '<li><a target="_blank" href="/s?wd='+data.s[i]+'">'+ data.s[i] +'</a></li>';}oUl.innerHTML = html;} else {oUl.style.display = 'none';//没有则不显示}}window.onload = function() {var oQ = document.getElementById('q');var oUl = document.getElementById('ul1');oQ.onkeyup = function() {if ( this.value != '' ) {var oScript = document.createElement('script');oScript.src = '/su?wd='+this.value+'&cb=leo';//this.value是我们在输入框中输入的内容。leo是我们定义的回调函数的名称document.body.appendChild(oScript);} else {oUl.style.display = 'none';}}}</script></head><body><input type="text" id="q" /><ul id="ul1"></ul></body></html>
嗯，先就这么多
然后聊聊jsonp的缺点（参考js高级程序设计这本书上的说法）
1、首先JSONP是从其他域中加载代码执行，如果其他域不安全，很可能会在响应中夹带一些恶意的代码，而此时除了完全放弃jsonp调用之外，没有办法追究。因此在使用不是你自己运维的web服务时，一定要保证它安全可靠
2、要确定JSONP请求是否是被并不容易，开发人员需要使用计时器检测指定时间内是否接受到了响应，但是毕竟每个用户上网的速度和宽带都不一样，所以这种方法也并不理想。
