<!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;
list-style: none;
}
input {
height: 30px;
}
</style>
</head>
<body>
<div id="app">
<input type="text" id="input" />
<ul id="list"></ul>
</div>
<script>
// https://www.baidu.com/s?wd=cf
// https://www.baidu.com/sugrec?prod=pc&wd=cf&cb=jQuery110206856435359839352_1560756774667&_=1560756774681
const input = document.getElementById('input');
const lists = document.getElementById('list');
input.addEventListener('input', inputChange);
function inputChange() {
let value = input.value;
let oScript = document.createElement('script');
oScript.src = `https://www.baidu.com/sugrec?prod=pc&wd=${value}&cb=getDataCb`; // src 里面传cb 就直接写就行了
document.body.appendChild(oScript);
};
function getDataCb(data) {
const { g } = data;
let str = '';
if (g) {
g.forEach(list => {
str += `<li><a href=https://www.baidu.com/s?wd=${list.q}>${list.q}<li>`
});
lists.innerHTML = str;
} else {
lists.innerHTML = '';
};
};
</script>
</body>
</html>
利用 jsonp写的一个简易百度搜索
最新推荐文章于 2022-09-30 11:39:30 发布