js 模拟百度关键字搜索与跳转

测试效果:

css样式:

ul{
    display:none;
}

html代码:

<input type="text" id="text" />
<ul id="list"></ul>

js代码:

var oTxt = document.getElementById("text");
var oUl = document.getElementById("list");
oTxt.onkeyup = function(){
    var val = oTxt.value;
    var oScript = document.createElement('script');
    oScript.src = "https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd="+val+"&cb=hhl";
    document.body.appendChild( oScript );
    document.body.removeChild( oScript );
}; 
function hhl( data ){
    var str = '';
    for( var i = 0;i<data.s.length;i++ ){
        str += '<li><a href="https://www.baidu.com/s?wd='+data.s[i]+'">'+data.s[i]+'</a></li>';
    }
    oUl.innerHTML = str;
    oUl.style.display = 'block';
}    

实现效果如图所示:

 

posted @ 2017-03-04 15:03  我要成为酷酷的人  阅读(2542)  评论(0编辑  收藏  举报