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>

以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，同时也希望多多支持我们！

赞 (0)

相关推荐

  • JS使用正则表达式实现关键字替换加粗功能示例

    JS使用正则表达式实现关键字替换加粗功能示例

    本文实例讲述了JS使用正则表达式实现关键字替换加粗功能的方法.分享给大家供大家参考,具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">

  • 关键字空格替换为逗号的js代码 原创

    新闻添加窗口 function doKeywords() { document.form1.keyword.value = document.form1.keyword.value.replace(new RegExp(',',"gm"),','); document.form1.keyword.value = document.form1.keyword.value.replace(new RegExp(' ',"gm"),','); } 关 键 字: 现在关键字

  • angluarjs实现过滤并替换关键字小功能

    angluarjs实现过滤并替换关键字小功能

    本文实例为大家分享了angluarjs实现过滤并替换关键字的具体代码,供大家参考,具体内容如下 html样式 <body ng-app="myapp" ng-controller="myCtrl"> <input type="text" ng-model="keytext"> <p>{{ keytext|wordFilter:"#" }}</p> </b

  • JavaScript 过滤关键字

    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 i

  • asp实现过滤关键字的函数

    过滤关键字<% '****************************** '函数:ChkKeyWord(ByVal keyword) '参数:keyword,关键字 '作者:阿里西西 '日期:2007/7/15 '描述:过滤关键字 '示例:ChkKeyWord("sfsdfdf'8&5ddd") '****************************** Function ChkKeyWord(ByVal keyword)   Dim FobWords, i  

  • JavaScript过滤字符串中的中文与空格方法汇总

    js 如何过滤字符串里中文或空格呢?方法有很多种,我们可以使用替换与正则表达式来实现,本文向大家介绍两个简单的例子,感兴趣的朋友可以参考一下. 1.javascript过滤空格: function moveSpace() { var str = " abc defg"; alert(str.replace(/[ ]/g, "")); } moveSpace(); 2.javascript过滤中文: var title ="字符串zifuchuan"

  • javascript过滤数组重复元素的实现方法

    javascript过滤数组重复元素的实现方法 以下是在网上找的资料,直接在项目中可以使用,大家可以参考下: 实现代码: function filterArray(receiveArray){ var arrResult = new Array(); //定义一个返回结果数组. for (var i=0; i<receiveArray.length; ++i) { if(check(arrResult,receiveArray[i]) == -1) { //在这里做i元素与所有判断相同与否 ar

  • asp.net MVC利用自定义ModelBinder过滤关键字的方法(附demo源码下载)

    asp.net MVC利用自定义ModelBinder过滤关键字的方法(附demo源码下载)

    本文实例讲述了MVC利用自定义ModelBinder过滤关键字的方法.分享给大家供大家参考,具体如下: 前面一篇主要讲解了如何利用ActionFilter过滤关键字,这篇主要讲解如何利用自己打造的ModelBinder来过滤关键字. 首先,我们还是利用上一篇<asp.net MVC利用ActionFilterAttribute过滤关键字的方法>中的实体类,但是我们需要加上DataType特性,以便于我们构造的ModelBinder通过DataTypeName识别出来: using System

  • asp.net MVC利用ActionFilterAttribute过滤关键字的方法

    asp.net MVC利用ActionFilterAttribute过滤关键字的方法

    本文实例讲述了asp.net MVC利用ActionFilterAttribute过滤关键字的方法.分享给大家供大家参考,具体如下: 在开发过程中,有时候会对用户输入进行过滤,以便保证平台的安全性.屏蔽的方法有很多种,但是今天我说的这种主要是利用MVC中的ActionFilterAttribute属性来实现.由于MVC天然支持AOP,所以我们这种过滤方式正好利用了MVC的这种特性. 下面请看步骤: 首先,当用户输入自己的名称的时候,带有类似<BR>的内容的时候,由于MVC默认是需要验证内容的,

  • JavaScript中关键字 in 的使用方法详解

    for-in循环应该用在非数组对象的遍历上,使用for-in进行循环也被称为"枚举". 对于数组 ,迭代出来的是数组元素 但不推荐,因为不能保证顺序,而且如果在Array的原型上添加了属性,这个属性也会被遍历出来,所以 最好数组使用正常的for循环,对象使用for-in循环 对于对象 ,迭代出来的是对象的属性: var obj = { "key1":"value1", "key2":"value2", &q

  • javascript 常用关键字列表集合

    Javascript关键字(Reserved Words)是指在Javascript语言中有特定含义,成为Javascript语法中一部分的那些字.Javascript关键字是不能作为变量名和函数名使用的.使用Javascript关键字作为变量名或函数名,会使Javascript在载入过程中出现编译错误. Javascript关键字列表:  break delete function return typeof  case do if switch var  catch else in this

  • JavaScript保留关键字汇总

    JavaScript保留关键字汇总

    JavaScript 标准 所有的现代浏览器已经完全支持 ES5(ECMAScript 5). JavaScript 保留关键字(keyword) Javascript 的保留关键字(标识符)不可以用作变量.标签或者函数名.有些保留关键字是作为 Javascript 以后扩展使用. abstract arguments boolean break byte case catch char class* const continue debugger default delete do doubl

  • JavaScript this关键字的深入详解

    JavaScript this关键字的深入详解

    目录 一.前言 二.了解this 三.this到底是谁 四.箭头函数this指向 扩展阅读 总结 一.前言 this关键字是JavaScript中最复杂的机制之一.它是一个很特别的关键字,被自动定义在所有函数的作用域中.对于那些没有投入时间学习this机制的JavaScript开发者来说,this的绑定一直是一件非常令人困惑的事. 二.了解this 学习this的第一步是明白this既不指向函数自身也不指向函数的词法作用域,你也许被这样的解释误导过,但其实它们都是错误的.随着函数使用场合的不同,

随机推荐