测试效果:

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';
}

实现效果如图所示:

js 模拟百度关键字搜索与跳转的更多相关文章

  1. js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题

    js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题 js模拟form表单提交数据源码: /** * js模拟form表单提交 * @param ...

  2. JS模拟百度分享侧边栏效果

    模拟百度分享侧边栏的弹出与滑入效果.当鼠标移入#div1分享侧边栏,#div1分享侧边栏区块匀速滑出直至其全部露出.当鼠标移除#div1分享侧边栏,#div1分享侧边栏区块匀速滑入隐藏,直至恢复初始位 ...

  3. 前端 ---- js 模拟百度导航栏滚动案例

    模拟百度导航栏滚动监听 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta chars ...

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

    <style type="text/css"> *{ margin: 0; padding: 0; } #text{ width: 300px; height: 30p ...

  5. JS——模拟百度搜索

    注意事项: 1.for循环移除子节点时,其长度是变化的 2.在文档流中,input.img.p等标签与其他标签有3px的距离,利用左浮动,可以消除3px距离 3.背景图片定位时,第一个值是x轴方向的值 ...

  6. Vue.js模拟百度下拉框

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. js 生成树以及关键字搜索生成树

    function main(keywords,data){ function fn(arr){ var flag = false; for(var i = 0;i <arr.length;i++ ...

  8. CSS实现模拟百度分享侧边栏效果

    在<JS模拟百度分享侧边栏效果>一文中对于Div区块的运动通过JS实现了鼠标移入滑出显示,鼠标移出滑入隐藏的效果.其实在CSS3中通过transition属性就可以较为轻松实现. < ...

  9. 百度移动搜索自动转码太坑爹,JS跳转地址会被抓取

    这段时间碰到个很崩溃的问题,一个页面通过 script 加载请求服务端进行统计再输出js进行跳转,分为两个步骤分别统计, 打开页面通过script 请求远程服务器进行统计并输出要通过js使页面跳转的最 ...

随机推荐

  1. 一、mysql架构

    一.简介 mysql是一个开源的数据库管理系统,它相对于oracle更加地轻量.成本低,随着功能的日益完善,它变得备受企业喜爱,尤其是中小企业. mysql的整体架构大体包括以下几个方面: 1)主体结 ...

  2. 九 ServerSocketChannel

    ServerSocketChannel是一个可以监听进来的TCP连接的通道,就像标准IO的ServerSocket一样.ServerSocketChannel类在java.nio.channels包中 ...

  3. Linux From Scratch(从零开始构建Linux系统,简称LFS)(三)

    九. 系统配置 1. 安装 LFS-Bootscripts-20150222 软件包包含一套在 LFS 系统启动和关闭时的启动和停止脚本. cd /sources tar -jxf lfs-boots ...

  4. cf1043E. Mysterious Crime(二分 前缀和)

    题意 题目链接 Sol 考场上做完前四题的时候大概还剩半个小时吧,那时候已经困的不行了. 看了看E发现好像很可做?? 又仔细看了几眼发现这不是sb题么... 先考虑两个人,假设贡献分别为\((x, y ...

  5. vue.js与angular.js的区别(个人)

    刚进入实训 讲师就要发一些什么比较高大上的东西,本人才疏学浅  浅浅的分享一下angularjs 和vue.js的区别.只是简单的理解一下 大神勿喷. 生实训之前学习的angular.js 只是理解了 ...

  6. C语言转置矩阵算法

    对一个nxn阶的矩阵进行转置,算法如下: #include <stdio.h> #define n 3 void MM(int a[][n]) { int i,j,temp; ;i < ...

  7. 【Python】回文palindrome——利用字符串反转

    回文 palindrome Python 字符串反转string[::-1] Slice notation "[a : b : c]" means "count in i ...

  8. python RabbitMQ广播

    消息公平分发 如果Rabbit只管按顺序把消息发到各个消费者身上,不考虑消费者负载的话,很可能出现,一个机器配置不高的消费者那里堆积了很多消息处理不完,同时配置高的消费者却一直很轻松.为解决此问题,可 ...

  9. 在Ubuntu14.10中部署Hadoop2.6.0单节点伪分布集群

    1. 环境信息如下: ubuntu:14.10 jdk:openjdk-1.7.0 hadoop:2.6.0 2. 下载hadoop2.6.0, http://apache.fayea.com/had ...

  10. android之键盘转载

    显示键盘: EditText editText.setFocusable(true); editText.setFocusableInTouchMode(true); editText.request ...