跨域获取小米数据

最新推荐文章于 2021-10-14 15:32:07 发布

scarsun

最新推荐文章于 2021-10-14 15:32:07 发布

阅读量461

点赞数

本文链接：https://blog.csdn.net/scarsun/article/details/81315644

版权

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>跨域获取数据</title>
	<style type="text/css">
		#list span {
			float: right;
		}
	</style>
</head>
<body>
	<form action="javascript:;" name="search-form">
		<input type="text" name="search-input">
		<input type="submit" value="搜索">
	</form>
	<ul id="list"></ul>
	<script>
		var form = document.forms['search-form'];
		var input = form.elements['search-input'];

		var list = document.getElementById('list');


		// 定义回调函数
		function callback(data) {
			list.innerHTML = '';
			data.forEach( v => {
				var newLi = document.createElement('li');
				newLi.innerHTML = '<span>约有'+ v.Rst +'件</span><b>'+ v.Key +'</b>';

				list.append(newLi);
			});
		}

		input.oninput = function () {
			// 创建script标签
			var script = document.createElement('script');

			script.src = 'https://search.mi.com/search/expand?keyword=' + this.value +'&jsonpcallback=callback';

			document.body.appendChild(script);
		};
	</script>
</body>
</html>