跨域获取数据(以百度为例)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<input type="text" name="" id="mysearch">
<ul id="list"></ul>
<script>
//https://www.baidu.com/sugrec?pre=1&p=3&ie=utf-8&json=1&prod=pc&from=pc_web&sugsid=38515,36556,38470,38352,38468,38375,38486,37937,37709,26350,38185&wd=a&req=2&csor=1&cb=jQuery1102009703213229325702_1682138582989&_=1682138582990
mysearch.oninput = function (evt) {
console.log(evt.target.value)
if (!evt.target.value) {//空字符串不请求
list.innerHTML = ""
return
}
var oscript = document.createElement("script")
oscript.src = `https://www.baidu.com/sugrec?pre=1&p=3&ie=utf-8&json=1&prod=pc&from=pc_web&sugsid=38515,36556,38470,38352,38468,38375,38486,37937,37709,26350,38185&wd=${evt.target.value}&req=2&csor=1&cb=test&_=1682138582990`
document.body.appendChild(oscript)
oscript.onload = function () {
oscript.remove()
}
}
function test(obj) {
console.log(obj.g)
list.innerHTML = obj.g.map(item => `<li>${item.q}</li>`).join("")
}
</script>
</body>
</html>
效果显示: