思路：
有一段文字，现在想找到查找到这段文字中的某个字符串，并且给这段文字所有匹配的字符串加上一个背景颜色，这个背景要首先设置好。
通过split('查找的文字');将这段文字分割成数组，
再通过join('<span>'+str+'</span>');将带样式查找的文字作为数组的分隔将数组连接成字符串。
按照这个思路，功能就大体实现了，但是还有问题，就是查找一次后，输入框清空再次查找会出现一些奇怪的情况。
判断一下就好了：if(!str)return;
贴一下代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<style type="text/css">
body{
width: 800px;
margin: 0 auto;
}
p{
width: 800px;
height: auto
}
span{
background-color: yellow;
}
</style>
<script type="text/javascript">
window.onload = function(){
var aIn = document.getElementsByTagName('input');
var oP = document.getElementsByTagName('p')[0];
aIn[1].onclick = function(){
var str = aIn[0].value;
if(!str)return;
var arr = oP.innerHTML.split(str);
oP.innerHTML = arr.join('<span>'+str+'</span>');
}
}
</script>
<body>
<input type="text" />
<input type="button" value="查找" />
<p>
归正传，最近新开通了平台gongxin，想借着平台的力量来使自己能有更快的提高（督促自
己）。随着社会的高速发展，每天的变化可以说是日新月异，大多数学gongxin技术的人们心中的
念头怕都是想着：”学的东西太多了，gongxin实在学不过来了“。其实每个想要上进的人又何尝
不是这样想的，本人也很痛苦，在学习新知识时，由于缺乏相关连续性知识，看到一半发
现这里不懂，gongxin于是又跑去补这块知识，补着补着，”咦gongxin，这个技术好啊！感觉学起来对自
己更有裨益。”于是乎，放下这块gongxin，又跑去看那快去了，可结果呢？就正如猴子掰玉米那
样——掰一个丢一个。gongxin
</p>
</body>
</html>