jsonp跨域百度

最新推荐文章于 2023-04-28 01:06:12 发布

barnett_y

最新推荐文章于 2023-04-28 01:06:12 发布

阅读量611

点赞数

分类专栏：【Javascript点滴知识】

本文链接：https://blog.csdn.net/sinat_17775997/article/details/77990942

版权

【Javascript点滴知识】专栏收录该内容

518 篇文章 19 订阅

订阅专栏

<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title></title>

		<style type="text/css">
			* {
				margin: 0;
				padding: 0;
			}
			#txt {
				width: 300px;
				height: 40px;
				border: 1px solid #f99;
				font-size: 14px;
				font-family: "微软雅黑";
			}
			#list {
				width: 300px;
				border: 1px solid #0f0;
				display: none;
			}
			#list li {
				width: 300px;
				height: 30px;
				font-size: 14px;
				list-style: none;
			}
			#list li a {
				display: block;
				line-height: 30px;
				color: #000;
				font-family: "微软雅黑";
				text-decoration: none;
			}
			#list li a:hover {
				background: #f99;
				color: #fff;
			}
		</style>

		<script type="text/javascript">
			window.onload = function() {
				var oTxt = document.getElementById('txt');
				oTxt.onkeyup = function() {
					var val = this.value;
					var oScript = document.createElement('script');
					oScript.src = "https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd=" + val + "&cb=callback"
					document.body.appendChild(oScript);
					document.body.removeChild(oScript);
				}
			};
		
			function callback(data) {
				console.log(data.s[0]);
				console.log(data);
				var oList = document.getElementById('list');
				var html = ''
				if (data.s.length > 0) {
					for (var i = 0; i < data.s.length; i++) {
						html += '<li><a href="https://www.baidu.com/s?wd=' + data.s[i] + '" target="_blank">' + data.s[i] + '</a></li>'
					}
					oList.style.display = 'block';
					oList.innerHTML = html;
				
				}else{
					oList.style.display = 'none';
				}
			}
		</script>

	</head>

	<body>
		<input type="text" id="txt" />
		<ul id="list">
			<li>
				<a href=""></a>
			</li>
		</ul>
	</body>

</html>