小编给大家分享一下JS如何实现搜索关键词的智能提示功能，希望大家阅读完这篇文章之后都有所收获，下面让我们一起去探讨吧！
成都创新互联专注于北镇网站建设服务及定制，我们拥有丰富的企业做网站经验。 热诚为您提供北镇营销型网站建设，北镇网站制作、北镇网页设计、北镇网站官网定制、微信小程序定制开发服务，打造北镇网络公司原创品牌,更为您提供
北镇网站排名全网营销落地服务。
js的作用是什么
1、能够嵌入动态文本于HTML页面。2、对浏览器事件做出响应。3、读写HTML元素。4、在数据被提交到服务器之前验证数据。5、检测访客的浏览器信息。6、控制cookies，包括创建和修改等。7、基于Node.js技术进行服务器端编程。
最近在百度搜索的时候，当你输入一个字或者词的时候，他会给你们弹出一个下拉框出来，里面是和你相关的搜索提示
比如 我输入杨字，他会给我提示以下搜索提示
我尝试着用JavaScript做了一个类似的练习，以下是我用VS2013写的代码，有不对的地方，请不吝赐教。
onload = function () {
function handle() {
var keyWords = {
"杨忠科": ["杨忠科的视频", "杨忠科的微博", "杨忠科的邮箱"],
"杨": ["杨利伟", "杨振宇", "杨过"],
"杨忠": ["杨忠科", "杨忠学", "杨忠爱国"],
"杨忠科爱":["杨忠科爱祖国","杨忠科爱首都","杨忠科爱学习"]
};
if (keyWords[this.value]) {
//判断body中是否有这个层,如果有就删掉了
if (document.getElementById('dv')) {
document.body.removeChild(document.getElementById('dv'));
}
//开始创建层
var dvObj = document.createElement('div');
dvObj.id = 'dv';
dvObj.style.width = '300px';
//dvObj.style.height = '200px'; //将来可以不要
dvObj.style.border = '1px solid red';
document.body.appendChild(dvObj);
//脱离文档流
dvObj.style.position = 'absolute';
dvObj.style.left = this.offsetLeft + 'px';
dvObj.style.top = this.offsetHeight + this.offsetTop + 'px';
//循环创建
for (var i = 0; i < keyWords[this.value].length; i++) {
//创建一个可以存文本的标签
var pObj = document.createElement('p');
pObj.innerText = keyWords[this.value][i];
//p标签要有小手，还有高亮显示
pObj.style.cursor = 'pointer';
pObj.style.margin = '5px';
pObj.onmouseover = function () {
this.style.backgroundColor = 'red';
};
pObj.onmouseout = function () {
this.style.backgroundColor = '';
}
dvObj.appendChild(pObj); //把p标签加到层中
}
//创建可以显示文件的标签
}
}
//firefox下检测状态改变只能用oninput,且需要用addEventListener来注册事件。
if (/msie/i.test(navigator.userAgent)) //ie浏览器
{
document.getElementById('txt').onpropertychange = handle
}
else {//非ie浏览器，比如Firefox
document.getElementById('txt').addEventListener("input", handle, false);
}
};
请输入搜索关键字百度一下
