web前端开发JavaScript网页屏蔽字敏感词过滤功能函数,看这个就够了,js源代码
先来说两句引导的话,敏感词过滤功能需要具备将全部的敏感词都过滤并且替换成*号或者其他任意符号,那么首先要创建一个新数组来存放自定义的敏感词。然后通过:字符串.replace()方法与正则表达式结合的方法来将字符串与敏感词数组进行字符匹配
匹配成功就进行替换最后生成一个新字符串,之所以会说生成一个新字符串是因为字符串一旦被定义就无法被通过方法或者其他更改内容,而replace方法会返回生成的新字符串而不会对原来的字符串进行任何改变。
话不多说,先把语句po出来瞧瞧
<style>
#msg{
width: 400px;
height: 200px;
border: 1px solid black; //定义发布框的样式,可以自定义,问题不大
}
</style>
<script>
var arr = [/靠/ig,/tmd/ig,/sb/ig,] //定义一个全局数组用来存放需要屏蔽的敏感词,格式: /敏感词/ig 双斜杠是正则表达式的用法 “i”表示忽略大小写全部检测到,g表示全局检测
// 将敏感词都替换成* 正则表达式和replace()
function BtnClick(){
var otex = document.getElementById("tex"); //通过 document.getElementById给获取给输入框区域定义的id 让js查找到此元素以便于让js控制此元素
var omsg = document.getElementById("msg"); //通过 document.getElementById给获取给发布框区域定义的id 让js查找到此元素以便于让js控制此元素
var oValue = otex.value; //定义一个变量来接收输入框的值,然后进行检测
for (var i = 0; i < arr.length; i++) {
oValue = oValue.replace(arr[i],"*"); //replace自己只能替换掉第一次检测到的敏感词,所以配合正则表达式以及ig的使用可以忽略大小写进行全部替换
//因为replace不能更改原字符串的数据,所以将replace生成的新字符串再重新赋值给oValue,字符串不能更改但是可以被赋值
}
omsg.innerHTML = oValue; //让发布框区域获取到已经进行敏感词屏蔽的字符串
otex.value = ''; //清空编辑区域字符串
}
</script>
</head>
<body>//页面结构
<textarea name="area" id="tex" cols="30" rows="10"></textarea>
<button id="btn" onclick="BtnClick();">发布</button>
<div id="msg"></div>
</body>