jsonp解决跨域(案例:动态获取百度数据)

jsonp了解一下,只要你看了,相信你就能懂!
首先我们先简单回忆一下ajax,ajax我们都不陌生,经常用,ajax的优点是不刷新整个页面从后台获取数据,但是也有缺点啊,不能跨域啊!但是好多时候我们还就得跨域请求数据。所以jsonp出场了。
必须清楚的一点,json和jsonp是没有任何关系的。jsonp是一种可以跨域获取数据的手段。
jsonp实现原理:动态创建script标签,在全局设置一个函数来接收script标签引进来的函数调用,然后在全局这个函数中接收数据。
接下来。。。代码演示

// input框输入内容,下面li里会显示相对应的数据

// js代码 
var oInp = document.querySelector('#inp');
var oUl = document.querySelector('.ul');    
function show(json) { // 全局函数show
	console.log(json.s); // 这个s 不知道是啥? 先别管。继续往下看
	oUl.innerHTML = ''; // 每次加载清空原先的
	for(var i=0; i

最后我们看看script标签引入的那串src怎么截取到的。。。

script.src = 'https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd='+inpVal+'&

今天太累了,改天继续。。。
想知道的朋友点个关注呗,下次持续更新。。。嘿嘿jsonp解决跨域(案例:动态获取百度数据)_第1张图片

你可能感兴趣的:(原生js,jsonp,原生js,jsonp跨域,动态获取script标签,动态获取百度数据)