js 正则过滤特殊字符[`~!@#$^&*()=|{}':;',\\[\\].<>/?~!@#¥……&*()——|{}【】‘;:”“'。,、?%+_]

2020-02-22 17:33:15

   JavaScript利用正则表达式过滤特殊字符,关键之处是正则表达式的正确性和完整性,保证常见特殊字符都可以过滤掉。

      但是,这个正则表达式有一个弊端,不能过滤掉“\”特殊字符。

我们也职能通过 indexOf来检测里面有没有\字符,判断两次呗。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>javaScript过滤特殊字符</title>
<style type="text/css">
	body{  
        width:80%;  
        background-color:#FFC;  
        height:100px;  
        font-size:14px;  
        font-family:"Times New Roman", Times, serif;  
        font-stretch:expanded;  
        font-style:inherit;  
        font-variant:inherit;  
        font-weight:bold;  
    }  
    #div1{  
        text-align:center;  
        width:100%;  
        height:100%;  
        line-height:inherit;  
    }  
    #btn{  
        font:Georgia, "Times New Roman", Times, serif;  
        font-size-adjust:inherit;  
        font-weight:bold;  
        background-color:#C96;  
        alignment-adjust:after-edge;  
        alignment-baseline:baseline;  
        word-break:break-all;  
        width:120px;  
        height:30px;  
        font-size:16px;  
        animation:ease;  
    }  
 
</style>
<script type="text/javascript">
 /**  
      * 过滤字符串函数  
      **/  
    function filterStr(str)  
    {  
        var pattern = new RegExp("[`~!@#$^&*()=|{}':;',\\[\\].<>/?~!@#¥……&*()——|{}【】‘;:”“'。,、?%+_]");  
        var specialStr = "";  
        for(var i=0;i<str.length;i++)  
        {  
             specialStr += str.substr(i, 1).replace(pattern, '');   
        }  
        return specialStr;  
    }  
      
    /**  
      * 检测过滤字符串函数  
      **/  
    function checkStr()  
    {  
        var str = document.getElementById("pContent").innerHTML;  
        alert("过滤之前的字符串:" + str);  
        str = filterStr(str);  
        alert("过滤之后的字符串:" + str);  
    }  
</script>
</head>
 
<body>
<div id="div1">
<p id="pContent">张三huhnjhj$%$^%^%&^*&<>?{}{{[]()_+|@~`$378748hyfgtyt35451fdhjdsh&%^^&$#%%&^^*&(*%$%$f4857485
</p>
<input type="button" id="btn" name="btn" value="过滤" οnclick="checkStr()"/>  
</div>
</body>	
</html>


  • 2020-01-13 21:56:45

    Ant Design Pro nginx配置

    Ant Design Pro nginx配置 今天看了下Ant和nginx的配置 给大家分享下 下边的配置可以直接使用 修改为自己的域名和文件夹目录就可以

  • 2020-01-13 23:36:35

    webpack之externals详解(精华)

    官网文档解释的很清楚,就是webpack可以不处理应用的某些依赖库,使用externals配置后,依旧可以在代码中通过CMD、AMD或者window/global全局的方式访问。

  • 2020-01-14 00:12:22

    webpack externals详解

    在众多的webpack配置教程中,对externals这个配置选项,总是一带而过,把文档中提到的几种方式都复述一遍,但是对于开发者而言,根本没法完全理解。本文试图通过一整篇文章,详细的对externals这个参数进行讲解。

  • 2020-01-14 01:06:37

    webpack externals 深入理解

    按照官方文档的解释,如果我们想引用一个库,但是又不想让webpack打包,并且又不影响我们在程序中以CMD、AMD或者window/global全局等方式进行使用,那就可以通过配置externals。这个功能主要是用在创建一个库的时候用的,但是也可以在我们项目开发中充分使用。

  • 2020-01-14 01:08:19

    webpack用externals优化echarts

    防止将某些 import 的包(package)打包到 bundle 中,而是在运行时(runtime)再去从外部获取这些扩展依赖(external dependencies)。