所谓jsonp,就是json的一种“使用模式”，可用于解决主流浏览器的跨域数据访问的问题,而接下来要写的案例就是利用了这个原理。
首先我们可以在百度查找中随便输入一些内容
接着打开控制台的Network，便可看到如上图所示，接着复制Request URL的内容，箭头所指的内容其实就是搜索的函数，即cb=函数名，接着看如下代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
*{margin:0;padding:0;}
.box{width:220px;
height:40px;
margin-top:50px;
margin-left:200px;
border:1px solid darkgoldenrod;
}
.list{width:220px;
margin-left:200px;
list-style: none;
}
</style>
</head>
<body>
<input class="box" type="text"></div>
<div class="list"></div>
<script>
var obox = document.getElementsByClassName("box")[0],
list = document.getElementsByClassName("list")[0];
obox.oninput = function () {
var val = this.value;//获取输入框内容
var os = document.createElement("script")
os.src = `https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd=${val}&cb=getdata`
document.body.appendChild(os);
os.onload = function () {
document.body.removeChild(os)
}
}
var getdata = function (data) {
var str = '';
for (let i = 0; i < data.s.length; i++) {
str += `<li>${data.s[i]}</li>`
}
list.innerHTML = str
}
</script>由于控制台给出的函数太长我便换成了getdata函数，而wd=后面的其实就是搜索内容，这样便实现了联想词查找