AJAX-跨域解决之 JSONP
（一）AJAX
ajax 就是从某个文件中去找相关的数据，把数据拿过来以后，利用数据 分析数据 去做我们想做的事情
分两部分：拿数据
用数据
oUsername1.onblur = function() {
//(以get方式 接口地址 配参数 m,a, 当前输入的用户名 回调函数 )
拿数据--> ajax('get', 'guestbook/index.php', 'm=index&a=verifyUserName&username=' + this.value, function(data) {
alert(data);
解析数据--> var d = JSON.parse(data);//解析
用数据--> oVerifyUserNameMsg.innerHTML = d.message;
if (d.code) {
oVerifyUserNameMsg.style.color = 'red';
} else {
oVerifyUserNameMsg.style.color = 'green';
}
});
}
（二）AJAX-跨域解决之 JSONP
跨域的问题
域：域名
跨域请求（访问）：一个域名下的文件请求另外一个域名下的资源，就产生了跨域
跨域的解决
Jsonp : json with padding
<script>标签
src的作用 ： 加载（包含指定的外部文件）
-可以跨域包含
-被包含的资源可以是任何类型的文件(可以是txt,php等)
-他只关注被包含的文件的内容是否是合法的JS
原理
定义函数
包含外部文件，在被包含的文件中执行调用定义好的函数
参数的（数据）的实现
-问题：包含就调用，通过动态创建<script>实现按需调用
-问题：包含动态文件时可以通过一个接口实现按需生成调用函数名称
1、JSONP : JSON with Padding
1.script标签
2.用script标签加载资源是没有跨域问题的
在资源加载进来之前定义好一个函数，这个函数接收一个参数（数据），函数里面利用这个参数做一些事情
然后需要的时候通过script标签加载对应远程文件资源，当远程的文件资源被加载进来的时候，就会去执行我们前面定义好的函数，并且把数据当作这个函数的参数传入进去
<script>
function fn(data) {
alert(data);
}
</script>
<!--<script src="2.txt"></script>-->
<script>
window.onload = function() {
var oBtn = document.getElementById('btn');
oBtn.onclick = function() {
//当按钮点击的时候再去加载远程资源，让他执行
var oScript = document.createElement('script');
oScript.src = '2.txt';
document.body.appendChild(oScript);//添加到页面当中
}
}
</script>
</head>
<body>
<input type="button" id="btn" value="按钮" />
</body>
