首页 > 编程语言 >基于JavaScript的关键词过滤示例

基于JavaScript的关键词过滤示例

时间:2024-11-06 11:58:14浏览次数:1  
标签:JavaScript const 示例 关键词 content result 30 个字符

业务场景中,合作第三方的的各种AI内容审核模型,完全达不到满意的状态,奇怪这么简单的一个东西,有这么复杂吗,自己动手来一个DEMO,给开发,仅供参考。

<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>关键词过滤器</title>
</head>
<body>

<h2>关键词过滤器</h2>

<textarea cols=60 rows=10 id="userInput" placeholder="请输入内容..."></textarea><br>
<button onclick="filterKeywords()">提交</button>

<h3>过滤后的内容:</h3>
<textarea cols=60 rows=10 id="filteredOutput" readonly></textarea>

<h3>关键词(用逗号分隔):</h3>
<textarea cols=60 rows=10 id="keywordsInput">http,https,qq,weixin,手机号,wx,fuck,.com,teng xun</textarea>

<script>
    // 提交时获取关键词并进行过滤
    function filterKeywords() {
        const content = document.getElementById("userInput").value;
        const keywords = getKeywords(); // 获取当前输入的关键词列表
        const filteredContent = filterContent(content, keywords);
        document.getElementById("filteredOutput").value = filteredContent;
    }

    // 获取关键词并生成数组
    function getKeywords() {
        const input = document.getElementById("keywordsInput").value;
        return input.split(",").map(keyword => keyword.trim().toLowerCase()).filter(Boolean);
    }

    // 过滤内容中的关键词及前10个字符和后30个字符
    function filterContent(content, keywords) {
        let result = content;
        // 构建适用于一般关键词和特殊关键词的正则
        const generalKeywords = keywords.filter(k => !k.includes('.')).join("|"); // 一般关键词
        const specialKeywords = keywords.filter(k => k.includes('.')).join("|"); // 特殊关键词
        
        // 针对一般关键词使用单词边界匹配
        const generalRegex = new RegExp(`(${generalKeywords})`, "gi");
        // 针对特殊关键词,不使用单词边界
        const specialRegex = new RegExp(`(${specialKeywords})`, "gi");

        // 替换一般关键词及其前10个字符和后30字符
        result = replaceKeywords(result, generalRegex);
        // 替换特殊关键词及其前10个字符和后30字符
        result = replaceKeywords(result, specialRegex);

        return result;
    }

    // 替换内容中匹配的关键词及其前10个字符和后30个字符
    function replaceKeywords(content, regex) {
        let result = content;
        let match;
        while ((match = regex.exec(content)) !== null) {
            const start = match.index;
            const end = Math.min(content.length, start + match[0].length + 30);  // 后30个字符
            const startReplace = Math.max(0, start - 10);  // 前10个字符
            const replaceStr = '*'.repeat(end - startReplace);  // 计算总替换长度

            result = result.slice(0, startReplace) + replaceStr + result.slice(end);
            regex.lastIndex = startReplace + replaceStr.length; // 更新正则搜索起点,避免无限循环
        }
        return result;
    }
</script>

</body>
</html>

 

标签:JavaScript,const,示例,关键词,content,result,30,个字符
From: https://www.cnblogs.com/getuser/p/18529706

相关文章

  • JavaScript的对象事件监听处理,交互式网页的关键!
    目录一、对象的事件二、常用的事件及处理1、鼠标事件(1) mousedown事件(2) mouseup事件(3) click事件(4)dblclick事件(5)mouseenter事件(6)mouseleave事件(7)wheel事件2、键盘事件(1)keydown事件(2)keyup事件3、表单事件(1)概念 (2)先设置一个简单的表单(3)获取表单节点(4)添加表......
  • 度娘去搜索语法及示例
    度娘搜索语法是一套用于提高搜索效率和精确度的特定规则和指令,可以帮助用户更精准地找到所需信息。以下是一些常用的度娘搜索语法及其详细示例:限定在网页标题中:intitle:该语法可以限定搜索结果仅包含网页标题中的关键词。例如,输入“新疆intitle:雪菊”将返回所有标题中包含“雪菊......
  • JavaScript用法
    JavaScript 用法HTML中的Javascript脚本代码必须位于 <script> 与 </script> 标签之间。Javascript脚本代码可被放置在HTML页面的 <body> 和 <head> 部分中。<script>标签如需在HTML页面中插入JavaScript,请使用<script>标签。<script>和</script>......
  • Python:用 turtle 库打造趣味动画 —— 基础示例与进阶拓展
    以下是一个使用Python的matplotlib库实现的简单动画程序示例,展示了一个正弦波动态变化的效果,标题为《Python与Matplotlib:动态正弦波动画展示》。收起python复制importnumpyasnpimportmatplotlib.pyplotaspltimportmatplotlib.animationasanimation#创......
  • javascript跨域问题排查
    什么是跨域问题跨域是指浏览器从一个域名的网页去请求另一个域名下的资源。出于安全考虑,浏览器会限制这种跨域请求。例如,网页http://example1.com中的JavaScript代码尝试去获取http://example2.com的数据,这就会触发跨域问题。同源策略规定,只有当协议(如http、https)、域名(如ex......
  • Javascript 代码规范
    JavaScript代码规范是编程时遵循的一套规则和最佳实践,以确保代码的可读性、可维护性和一致性。以下是一些关键的JavaScript常见代码规范:1.使用严格模式在所有脚本文件或函数开头添加‘usestrict’;声明,以启用严格模式(strictmode),这有助于捕获潜在的错误并避免不明......
  • 让金融数据处理更精准-C#银行回单识别集成示例、回执单识别
    银行回单识别接口是一种基于人工智能和光学字符识别(OCR)技术的解决方案,能够自动识别和提取银行回单中的关键信息。通过这项技术,用户可以对回单文字内容进行提取,系统便能快速准确地识别回单上的交易金额、时间、银行名称、账户信息等各类重要数据,并将其转化为可结构化的数字信息......
  • 基于SSM+uniapp的营养食谱系统+LW参考示例
    1.项目介绍功能模块:用户管理、年龄类型管理、阶段食谱管理、体质类型管理、季节食谱管理、职业食谱管理等系统角色:管理员、普通用户技术栈:SSM,uniapp,Vue等测试环境:idea2024,HbuilderX,微信开发工具,MySQL5.7,Maven3,Navicat2.项目部署2.1后端部署创建数据库,导入sql通过idea......
  • 基于SpringBoot的动物领养救助系统+LW示例参考
    系列文章目录1.基于SSM的洗衣房管理系统+原生微信小程序+LW参考示例2.基于SpringBoot的宠物摄影网站管理系统+LW参考示例3.基于SpringBoot+Vue的企业人事管理系统+LW参考示例4.基于SSM的高校实验室管理系统+LW参考示例5.基于SpringBoot的二手数码回收系统+原生微信小......
  • 我不知道的Javascript
    Javascript数据类型基本数据类型(存放在栈内存中,当被引用和拷贝时会复制一个完全相等的变量)Number,String,Boolean,Symbol,Undefined,Null引用数据类型(对象类型,存放在堆内存中,存储的是地址,当引用和拷贝时,提供的是地址.有共享地址的特征)ObjectArrayRe......