使用HTML制作简单的搜索功能(可实现百度搜索) |
您所在的位置:网站首页 › 百度搜索进不去 › 使用HTML制作简单的搜索功能(可实现百度搜索) |
实现代码:
form{
text-align: center;
}
form .text {
display: inline-block;
border: 0;
width: 260px;
height: 35px;
font-size: 14px;
outline: none;
border: 2px solid #01af63;
}
form .search {
width: 90px;
height: 38px;
border: 2px solid #01af63;
outline: none;
cursor: pointer;
/* cursor: pointer; 鼠标悬停或点击时button时鼠标变成其他图标 */
text-align: center;
background-color: #01af63;
color: #FFFFFF;
}
业务流程: 在输入框内输入你要搜索的内容,输入完点击按钮即可完成百度搜索 业务逻辑: 主要是通过form表单的action属性来实现 (URL 当表单提交时向何处发送表单数据),输入框输入内容后,再点击按钮 ( submit用在表单内,里面有类似的默认方法封装,普通单击就是提交所在表单),这时你的内容就会提交到action属性指定的URL里面即可完成搜索跳转。 URL可分为两种: 绝对 URL - 指向另一个网站(比如 action="http://www.xxx.com") 相对 URL - 指向网站内的一个文件(比如 action="xxx.html") 要实现搜索功能的URL在哪里找呢? 最简单的方法,友友们可以随便找个搜索引擎进行一次搜索业务,点击搜索按钮跳转后,友友们把目光聚焦到地址栏,拿百度引擎做案例当你搜索完成地址栏会变成这样 你只需要拿到问号前面的那一串内容即可,然后放在form表单的action属性里面即可实现百度引擎的搜索。为什么是拿问号前面的内容呢 ? 因为这是百度用于请求搜索功能服务器的URL,有兴趣的友友可以查看axios文档。也可以拿到其他搜索引擎的URL,步骤同上即可。 |
今日新闻 |
推荐新闻 |
CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |