1. [文件] jsonp(实现跨域).html~2KB 下载 (10) !doctype htmlhtml head meta charset="UTF-8" meta name="Keywords" content="" meta name="Description" content="" titleDocument/title style type="text/css"*{margin:0;padding:0;}body{font-siz
1. [文件] jsonp(实现跨域).html ~ 2KB 下载(10)
<!doctype html>
<html >
<head>
<meta charset="UTF-8">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>Document</title>
<style type="text/css">
*{margin:0;padding:0;}
body{font-size:14px;font-family:"微软雅黑"}
a{text-decoration:none;color:#000}
ul li{list-style:none}
input{width:500px;line-height:30px;border:1px solid #666;border-radius:3px;margin:100px auto 0;display:block;text-indent:1em}
ul{width:500px;margin:0px auto;cursor:pointer}
ul li a{display:block;text-indent:1em}
</style>
</head>
<body>
<!--通过img标签的src可以实现跨域-->
<input type="text" id="input"/>
<ul id="ul">
</ul>
<script type="text/javascript">
var ulDom = document.getElementById("ul");
var inputDom = document.getElementById("input");
inputDom.onkeyup=function(){
var value = this.value;
var valen=value.trim().length;
//百度关键字的接口
var url = "https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd="+value+"&cb=search";
var sptDom = document.createElement("script");
sptDom.src=url;
document.body.appendChild(sptDom);
document.body.removeChild(sptDom);
};
function search(json){
var str = json.s;
var ulHtml="";
for(var i=0,len=str.length;i<len;i++){
//百度搜索的接口
var url = "https://www.baidu.com/s?wd="+str[i]+"";
ulHtml+="<li><a href='"+url+"' target='_blank'>"+str[i]+"</a></li>";
}
if(ulHtml==""){
ulDom.style.border="";
}else{
ulDom.style.border="1px solid #ccc";
}
ulDom.innerHTML = ulHtml;
};
//代理事件ul代理li的
ulDom.onmouseover=function(e){
var ev=e||window.event;
var target = ev.target||ev.srcElement;
target.style.background="#eee";
};
ulDom.onmouseout=function(e){
var ev=e||window.event;
var target = ev.target||ev.srcElement;
target.style.background="";
};
</script>
</body>
</html>