正则筛选input值

DenggLin

于 2017-08-30 18:48:09 发布

阅读量575

点赞数 1

分类专栏： js

本文链接：https://blog.csdn.net/qq_34117170/article/details/77720718

版权

js 专栏收录该内容

47 篇文章 0 订阅

订阅专栏

看到有人问这个问题就写了一个

在输入框中输入在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>

DenggLin

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
正则筛选input值

在输入框中输入在p里面查找，并背景变色效果如下 <!DOCTYPE html><html><head> <title>检索关键字</title></head><body> <div> <input type="text" name="" id="searchKey"> <button onclick="searcFn()">查找</but
复制链接

扫一扫

专栏目录