看到有人问这个问题就写了一个
在输入框中输入在p里面查找,并背景变色
效果如下
<!DOCTYPE html>
<html>
<head>
<title>检索关键字</title>
</head>
<body>
<div>
<input type="text" name="" id="searchKey">
<button onclick="searcFn()">查找</button>
</div>
<p id="base">
a ticket wang deng lin
</p>
<script type="text/javascript">
function searcFn(){
var _key=document.querySelector("#searchKey").value;
var _base=document.querySelector("#base");
var b=(_base.innerHTML).replace(/<[^>]+>/g, "");
_base.innerHTML=b.replace(new RegExp(_key,'gi'),'<span style="background:yellow;">'+_key+'</span>');//想加变量这能使用new RegExp(_key,'gi')
}
</script>
</body>
</html>