原生JS模拟百度搜索关键字与跳转

Posted 我要成为酷酷的人

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了原生JS模拟百度搜索关键字与跳转相关的知识,希望对你有一定的参考价值。

css:

ul{

  display:none;

}

html:

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

<ul id="list"></ul>

JS:

<script>

  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‘;

  }

</script>

以上是关于原生JS模拟百度搜索关键字与跳转的主要内容,如果未能解决你的问题,请参考以下文章

百度搜索关键字提示跳转

原生JS模拟百度搜索框

百度搜索关键词,跳转内容显示不对

原生JS实现百度搜索功能

怎样用 Javascript 模拟点击按钮执行搜索?

获取百度地图POI数据三(模拟关键词搜索)