js正则表达式过滤html标签详解

在前端开发中，我们很有必要过滤掉用户输入的文本中的HTML标签以防范XSS攻击。我们可以用正则表达式来做到这个：

我们自定义一个函数，代码如下：

function removeHTMLTag(str) {
            str = str.replace(/<\/?[^>]*>/g,''); //去除HTML tag
            str = str.replace(/[ | ]*\n/g,'\n'); //去除行尾空白
            //str = str.replace(/\n[\s| | ]*\r/g,'\n'); //去除多余空行
            str=str.replace(/&nbsp;/ig,'');//去掉&nbsp;
            return str;
}

我们来解释下上面代码的含义

第一个:/<\/?[^>]*>/g

在js中正则表达式是以“/”开头的，后面的/g，含义是表示全局模式，意思是在将匹配的模式应用于整个字符串，而不是在第一次匹配上之后就停止匹配了。

<\/?[^>]*> 这个分开来解释，其中第二个字符“\”是一个转移字符，用来转移后面的”/”字符的。?匹配0或1个正好在它之前的那个字符。注意：这个元字符不是所有的软件都支持的。所以<\/?就是匹配html标签中的”</”格式或者“<”格式的。

再来说[^>]*>。[]是含义

^的含义是：匹配一行的开始。例如正则表达式^When in能够匹配字符串”When in the course of human events”的开始，但是不能匹配”What and When in the”。意思就是匹配以“When in”开头的文字。

*的含义是：匹配0或多个正好在它之前的那个字符。例如正则表达式。*意味着能够匹配任意数量的任何字符

因此[^>]*意思是匹配>之外的字符。

第二个：/[ | ]*\n/g：虽然选择其中之一进行匹配。

第三个：/&nbsp;/ig：就是直接查找&nbsp;字符，后面的/ig的含义是在全局模式下进行不区分大小写的查找。