本文主要介绍了javascript过滤关键字的方法。具有很好的参考价值。下面跟着小编一起来看下吧
效果图：
话不多说，请看代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
em { font-size: 16px; color: red; }
</style>
</head>
<body>
<p id="cont">JavaScript过滤关键字的方法JavaScript过滤关键字的方法</p>
<script>
//================================= 可用状态代码 =====================================
// var arr = ['Java','关键字', '方法'],
// arrText = arr.join('|'),
// var params = document.querySelector('#cont');
//
// // 替换关键字
// params.innerHTML = params.innerHTML.replace(new RegExp(arrText, "ig"), "<em>$&</em>");
// var arr = [];
// console.log(arr);
//================================= 修改后的代码 =====================================
/**
* 过滤关键字
* @param keyArr 需要过滤的关键字数组
* @param ele 过滤的节点
*/
function filterContent(keyArr, ele) {
/**
* 一个程序的标准准则
* 1. 可用, 可以实现核心的需求
* 2. 健壮, 兼容性处理, 边界处理, 异常处理, 用户输入校验
* 3. 可靠, 任何时候都要有返回值
* 4. 宽容, 对需求宽容, 对调用着宽容, 对维护者宽容
* 5. 精益求精, 可靠的注释...
*/
try {
// 检测是否为 undefined 或者为一个数组，或者数组长度是否大于 1, 这里的返回 -1 只是为了有返回值, 也可以不写
if (keyArr === 'undefined' || !(keyArr instanceof Array) || keyArr.length < 1) return -1;
// 将数组里面的元素以 | 进行合并方便进行正则比较, 如 张三|李四
var arrTxt = keyArr.join('|'),
regObj = new RegExp(arrTxt, 'ig');
// 替换关键字
ele.innerHTML = ele.innerHTML.replace(regObj, "<em>$&</em>");
} catch (e) {
console.log('出错啦~' + e);
}
}
// 调用
var arr = ['Java','关键字', '方法'];
var params = document.querySelector('#cont');
filterContent(arr, params);
</script>
</body>
</html>以上就是JavaScript 过滤关键字实例详解的详细内容，更多请关注php中文网其它相关文章！
java怎么学习？java怎么入门？java在哪学？java怎么学才快？不用担心，这里为大家提供了java速学教程(入门到精通)，有需要的小伙伴保存下载就能学习啦！
广告![ThinkPHP5快速开发企业站点[全程实录]](https://img.php.cn/upload/course/000/000/068/6253d918a3ce7278.png)
收藏
收藏
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
815
