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';
}
实现效果如图所示:
js 模拟百度关键字搜索与跳转的更多相关文章
- js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题
js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题 js模拟form表单提交数据源码: /** * js模拟form表单提交 * @param ...
- JS模拟百度分享侧边栏效果
模拟百度分享侧边栏的弹出与滑入效果.当鼠标移入#div1分享侧边栏,#div1分享侧边栏区块匀速滑出直至其全部露出.当鼠标移除#div1分享侧边栏,#div1分享侧边栏区块匀速滑入隐藏,直至恢复初始位 ...
- 前端 ---- js 模拟百度导航栏滚动案例
模拟百度导航栏滚动监听 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta chars ...
- 原生JS模拟百度搜索关键字与跳转
<style type="text/css"> *{ margin: 0; padding: 0; } #text{ width: 300px; height: 30p ...
- JS——模拟百度搜索
注意事项: 1.for循环移除子节点时,其长度是变化的 2.在文档流中,input.img.p等标签与其他标签有3px的距离,利用左浮动,可以消除3px距离 3.背景图片定位时,第一个值是x轴方向的值 ...
- Vue.js模拟百度下拉框
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- js 生成树以及关键字搜索生成树
function main(keywords,data){ function fn(arr){ var flag = false; for(var i = 0;i <arr.length;i++ ...
- CSS实现模拟百度分享侧边栏效果
在<JS模拟百度分享侧边栏效果>一文中对于Div区块的运动通过JS实现了鼠标移入滑出显示,鼠标移出滑入隐藏的效果.其实在CSS3中通过transition属性就可以较为轻松实现. < ...
- 百度移动搜索自动转码太坑爹,JS跳转地址会被抓取
这段时间碰到个很崩溃的问题,一个页面通过 script 加载请求服务端进行统计再输出js进行跳转,分为两个步骤分别统计, 打开页面通过script 请求远程服务器进行统计并输出要通过js使页面跳转的最 ...
随机推荐
- 一、mysql架构
一.简介 mysql是一个开源的数据库管理系统,它相对于oracle更加地轻量.成本低,随着功能的日益完善,它变得备受企业喜爱,尤其是中小企业. mysql的整体架构大体包括以下几个方面: 1)主体结 ...
- 九 ServerSocketChannel
ServerSocketChannel是一个可以监听进来的TCP连接的通道,就像标准IO的ServerSocket一样.ServerSocketChannel类在java.nio.channels包中 ...
- Linux From Scratch(从零开始构建Linux系统,简称LFS)(三)
九. 系统配置 1. 安装 LFS-Bootscripts-20150222 软件包包含一套在 LFS 系统启动和关闭时的启动和停止脚本. cd /sources tar -jxf lfs-boots ...
- cf1043E. Mysterious Crime(二分 前缀和)
题意 题目链接 Sol 考场上做完前四题的时候大概还剩半个小时吧,那时候已经困的不行了. 看了看E发现好像很可做?? 又仔细看了几眼发现这不是sb题么... 先考虑两个人,假设贡献分别为\((x, y ...
- vue.js与angular.js的区别(个人)
刚进入实训 讲师就要发一些什么比较高大上的东西,本人才疏学浅 浅浅的分享一下angularjs 和vue.js的区别.只是简单的理解一下 大神勿喷. 生实训之前学习的angular.js 只是理解了 ...
- C语言转置矩阵算法
对一个nxn阶的矩阵进行转置,算法如下: #include <stdio.h> #define n 3 void MM(int a[][n]) { int i,j,temp; ;i < ...
- 【Python】回文palindrome——利用字符串反转
回文 palindrome Python 字符串反转string[::-1] Slice notation "[a : b : c]" means "count in i ...
- python RabbitMQ广播
消息公平分发 如果Rabbit只管按顺序把消息发到各个消费者身上,不考虑消费者负载的话,很可能出现,一个机器配置不高的消费者那里堆积了很多消息处理不完,同时配置高的消费者却一直很轻松.为解决此问题,可 ...
- 在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 ...
- android之键盘转载
显示键盘: EditText editText.setFocusable(true); editText.setFocusableInTouchMode(true); editText.request ...