【学习了，但是宝宝并没用过系列】
因为那个很好用的Ajax，或者说是XMLHttpRequest是不允许跨域的，所以就有了接下来的一系列东西。
JSONP，of cource it should be layed out first….
So what is JSONP? json with padding , 是JSON的一种使用方式：把JSON包在函数里面来使用：callback({“name”:”Finedy”});
<script type="text/javascript">
function dosomething(jsondata){ //处理获得的json数据 }
</script>
<script src="http://example.com/data.php?callback=dosomething"></script>
firstly ,we have to know that 数据拿到自己这儿，而服务器在外面，
优点：
兼容性好，
局限性：
只支持HTTP的get，post和其他方式都不行。
怎么用
创建script在head里，
script = document.createElement('script');
script.src = 'http://example.com/cgi-bin/jsonp?q=What+is+the+meaning+of+life%3F';
script.id = 'JSONP';
script.type = 'text/javascript';
script.charset = 'utf-8';
// Add the script to the head, upon which it will load and execute.
var head = document.getElementsByTagName('head')[0]; head.appendChild(script);
（但其实这里head.appendChild是有风险的，因为如果在IE6的head里面有base节点，那么后续的remove工作会报"Invalid argument”的error），所以最稳妥的方式是用insert来在第一个子节点之前插入：replace
head.appendChild( script );
with
head.insertBefore( script, head.firstChild );
当然如果你很懒，不想使用原生JS，jquery会为你省掉很多力气：
var script;
while (script = document.getElementById('JSONP')) {
script.parentNode.removeChild(script);
}
只删掉script是不够的，必须要把里面所有属性也删掉。（因为DOM和JS有不同的垃圾回收算法。）
<script type="text/javascript">
$.getJSON('http://example.com/data.php?callback=?,function(jsondata)'){
//处理获得的json数据 });
</script>
jquery会自动生成一个全局函数来替换callback=?
中的问号，之后获取到数据后又会自动销毁，实际上就是起一个临时代理函数的作用。
$.getJSON方法会自动判断是否跨域，不跨域的话，就调用普通的ajax方法；跨域的话，则会以异步加载js文件的形式来调用jsonp的回调函数。
因为jquery首先会判断是否跨域了，如果没有，那么直接ajax；如果有，那就进行跨域处理。
var script;
while (script = document.getElementById('JSONP')) {
script.parentNode.removeChild(script);
// Browsers won't garbage collect this object.
// So castrate it to avoid a major memory leak.
for (var prop in script) {
delete script[prop];
}
}
然后每次删掉所有属性其实是没有必要的，只要每次改变它的src就可以了。
网友评论