前端过滤关键字
发表于:2026-11-01 作者:千家信息网编辑
千家信息网最后更新 2026年11月01日,
千家信息网最后更新 2026年11月01日前端过滤关键字
| xmlns="http://www.w3.org/1999/xhtml"> | |
| http-equiv="Content-Type" content="text/html; charset=gb2312" /> | |
| body | |
| { | |
| font-size: 14px; | |
| } | |
| h3 | |
| { | |
| display: inline; | |
| margin: 0; | |
| } | |
| #spnKeyNum, #spnWordNum | |
| { | |
| color: #F00; | |
| } | |
| #spnList a | |
| { | |
| font-size: 12px; | |
| color: #0000FF; | |
| } | |
| #spnTime | |
| { | |
| color: #600; | |
| } | |
| textarea, #divDisplay | |
| { | |
| margin: 0; | |
| padding: 0; | |
| font-size: 14px; | |
| display: block; | |
| background: #EEE; | |
| border: #999 solid 1px; | |
| } | |
| #txtKeys | |
| { | |
| width: 95%; | |
| height: 100px; | |
| } | |
| #txtContent, #divDisplay | |
| { | |
| height: 400px; | |
| width: 95%; | |
| } | |
| #divDisplay | |
| { | |
| display: none; | |
| overflow: auto; | |
| } | |
| #divDisplay em | |
| { | |
| color: #F00; | |
| font-style: normal; | |
| } | |
| #divFoot | |
| { | |
| padding: 5px; | |
| width: 95%; | |
| } | |
| #spnLable2 | |
| { | |
| margin: 5px; | |
| float: left; | |
| color: #690; | |
| } | |
| button | |
| { | |
| float: left; | |
| } | |
| #desc | |
| { | |
| color: #333; | |
| float: right; | |
| } | |
| onload="handleLoad();"> | |
id="divTop"> | |
| 关键字 | |
| id="spnLable1">(id="spnKeyNum">0个) | |
| id="spnList"> | |
| href="_javascript:load('city.txt');">世界城市 | |
| href="_javascript:load('words.txt');">部分英文单词 | |
| href="_javascript:load('idiom.txt');">成语全集 | |
id="divMain"> | |
| ="txtKeys" onchange="handleKeyChange();"> | |
| 内容 | |
| id="spnLable1">(id="spnWordNum">0字) | |
| ="txtContent" onchange="handleContentChange();"> | |
id="divDisplay"> | |
id="divFoot"> | |
| id="spnLable2">搜索用时: id="spnTime">0ms | |
| ="btnStart" onclick="handleClick();"> 测试 | |
| ="btnReset" onclick="reset()" disabled="disabled"> 重置 | |
| id="desc">EtherDream 2009 | |
| var tblRoot; | |
| /* | |
| * 函数: makeTree | |
| * 注释: 将关键字生成一颗树 | |
| */ | |
| function makeTree() | |
| { | |
| var strKeys = objKeys.value; | |
| var arrKeys = strKeys.split(""); | |
| var tblCur = tblRoot = {}; | |
| var key; | |
| for(var i=0,n=arrKeys.length; i | |
| { | |
| key = arrKeys[i]; | |
| if(key == ';') //完成当前关键字 | |
| { | |
| tblCur.end = true; | |
| tblCur = tblRoot; | |
| continue; | |
| } | |
| if(key in tblCur) //生成子节点 | |
| tblCur = tblCur[key]; | |
| else | |
| tblCur = tblCur[key] = {}; | |
| } | |
| tblCur.end = true; //最后一个关键字没有分割符 | |
| } | |
| /* | |
| * 函数: search | |
| * 注释: 标记出内容中关键字的位置 | |
| */ | |
| function search(content) | |
| { | |
| var tblCur; | |
| var i = 0; | |
| var n = content.length; | |
| var p, v; | |
| var arrMatch = []; | |
| while(i < n) | |
| { | |
| tblCur = tblRoot; | |
| p = i; | |
| v = 0; | |
| for(;;) | |
| { | |
| if(!(tblCur = tblCur[content.charAt(p++)])) | |
| { | |
| i++; | |
| break; | |
| } | |
| if(tblCur.end) //找到匹配关键字 | |
| v = p; | |
| } | |
| if(v) //最大匹配 | |
| { | |
| arrMatch.push(i-1, v); | |
| i = v; | |
| } | |
| } | |
| return arrMatch; | |
| } | |
| var $ = function(id){return document.getElementById(id)}; | |
| var objKeys = $("txtKeys"); | |
| var objContent = $("txtContent"); | |
| var objDisplay = $("divDisplay"); | |
| var bKeyChanged = false; | |
| function handleKeyChange() | |
| { | |
| var str = objKeys.value; | |
| var n; | |
| if(str.length==0) | |
| n = 0; | |
| else | |
| n = str.split(";").length; | |
| /* | |
| * 显示关键字数量 | |
| */ | |
| $("spnKeyNum")[xss_clean] = n; | |
| bKeyChanged = true; | |
| } | |
| function handleContentChange() | |
| { | |
| /* | |
| * 显示内容长度 | |
| */ | |
| $("spnWordNum")[xss_clean] = objContent.value.length; | |
| } | |
| function handleLoad() | |
| { | |
| handleKeyChange(); | |
| handleContentChange(); | |
| } | |
| function handleClick() | |
| { | |
| var strContent = objContent.value; | |
| var arrMatch; | |
| var arrHTML = []; | |
| var strHTML; | |
| var mid; | |
| var p = 0; | |
| $("btnStart").disabled = true; | |
| $("btnReset").disabled = false; | |
| if(bKeyChanged) | |
| { | |
| makeTree(); | |
| bKeyChanged = false; | |
| } | |
| /* | |
| * 开始搜索! | |
| */ | |
| var t = +new Date(); | |
| arrMatch = search(strContent); | |
| /* | |
| * 搜索用时 | |
| */ | |
| $("spnTime")[xss_clean] = +new Date() - t; | |
| /* | |
| * 标记关键字 | |
| */ | |
| for(var i=0,n=arrMatch.length; i | |
| { | |
| mid = arrMatch[i]; | |
| arrHTML.push(strContent.substring(p, mid), | |
| "", | |
| strContent.substring(mid, p = arrMatch[i+1]), | |
| ""); | |
| } | |
| arrHTML.push(strContent.substring(p)); | |
| strHTML = arrHTML.join("").replace(/\n/g, " "); | |
| /* | |
| * 显示结果 | |
| */ | |
| objDisplay[xss_clean] = strHTML; | |
| objContent.style.display = "none"; | |
| objDisplay.style.display = "block"; | |
| } | |
| function reset() | |
| { | |
| $("btnStart").disabled = false; | |
| $("btnReset").disabled = true; | |
| objContent.style.display = "block"; | |
| objDisplay.style.display = "none"; | |
| } | |
| function load(file) | |
| { | |
| /* | |
| * 创建HTTP组件 | |
| */ | |
| if(window.ActiveXObject) | |
| { | |
| objHttp = new ActiveXObject("Microsoft.XMLHTTP"); | |
| } | |
| else | |
| { | |
| objHttp = new XMLHttpRequest(); | |
| objHttp.overrideMimeType("text/xml"); | |
| } | |
| objHttp.onreadystatechange = function() | |
| { | |
| if(objHttp.readyState != 4) | |
| return; | |
| objKeys.value = objHttp.responseText; | |
| handleKeyChange(); | |
| }; | |
| /* | |
| * 发送请求 | |
| */ | |
| objHttp.open("GET", file, true); | |
| objHttp.send(null); | |
| } | |
关键
关键字
搜索
内容
函数
标记
注释
生成
最大
世界
位置
全集
单词
城市
成语
数量
组件
结果
节点
部分
数据库的安全要保护哪些东西
数据库安全各自的含义是什么
生产安全数据库录入
数据库的安全性及管理
数据库安全策略包含哪些
海淀数据库安全审计系统
建立农村房屋安全信息数据库
易用的数据库客户端支持安全管理
连接数据库失败ssl安全错误
数据库的锁怎样保障安全
喔噻互联网科技有限公司
互联网金融 科技金融
互联网科技金融公司
互联网 卓越科技
狮子座互联网科技有限公司
美国互联网黑科技
上海致骋互联网科技
上海卓越科技 互联网
深圳前海聚择互联网科技有限公司
花神(南京)互联网科技有限公司
开一家科技互联网公司需要多少钱
浙南科技城互联网大厦建设工程
用友工业互联网科技发展
美国互联网科技实力
深圳无忧互联网科技
产业互联网科技服务公司
国产互联网科技公司
中国互联网公司的科技投入
互联网时代高科技布局
互联网大会出现的黑科技
南京欣网互联网络科技
高科技互联网
新华互联网科技学院
万易互联网科技
苏州互联网科技贷款公司
互联网前沿科技
老年人脱离互联网科技的作文
北京华百购互联网科技有限公司
宜昌元轩互联网科技有限公司
青岛易易互联网科技