超简单Js实现自定义搜索框搭建百度搜索引擎

土生土长的IU

于 2019-07-12 15:12:04 发布

阅读量2.3k

点赞数 1

分类专栏： javascript 文章标签： JS 前端新手

本文链接：https://blog.csdn.net/AIB_Kasic/article/details/95620873

版权

javascript 专栏收录该内容

79 篇文章 0 订阅

订阅专栏

效果图
在这里插入图片描述
目的：
看到有很多导航网站，里面有各种搜索功能，比如百度，360…如图

就想知道他们是怎么跳转的，于是便手动撸起了代码

代码如下

简单易懂,直接新建一个html复制粘贴就可以啦~喜欢别忘记点收藏哦

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>导航</title>
</head>
<body>
    百度<input id="searchInput" type="text"> <button onclick="to()">搜索</button>
        
    </button>
</body>
<script>
    function to(){
        var searchValue = document.getElementById("searchInput").value;
        // alert(searchValue);
       window.location.href="http://www.baidu.com/s?ie=UTF-8&wd="+searchValue;
    }
</script>
</html>

土生土长的IU

关注

1
点赞
踩
10

收藏

觉得还不错? 一键收藏
1
评论
超简单Js实现自定义搜索框搭建百度搜索引擎

效果图目的：看到有很多导航网站，里面有各种搜索功能，比如百度，360…如图就想知道他们是怎么跳转的，于是便手动撸起了代码代码如下简单易懂,直接新建一个html复制粘贴就可以啦~喜欢别忘记点收藏哦<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> ...
复制链接

扫一扫

专栏目录