如何使用 Tampermonkey 脚本检测多个关键词并实现智能响应-html教程-PHP中文网

本文介绍如何改造基础 tampermonkey 脚本，使其支持同时检测多个关键词：若任一关键词存在则弹窗提示并可扩展通知；若全部缺失则自动刷新页面。

本文介绍如何改造基础 tampermonkey 脚本，使其支持同时检测多个关键词：若任一关键词存在则弹窗提示并可扩展通知；若全部缺失则自动刷新页面。

在实际网页监控场景中（例如抢购、公告监测或竞品动态跟踪），仅检测单个关键词往往不够灵活。原脚本通过 indexOf() 判断单一字符串是否存在，但扩展为多词检测只需引入数组与循环逻辑，并合理设计匹配策略。

以下是一个健壮、可维护的优化版本：

window.addEventListener('load', function() {
    console.log("Page loaded.");
    // ✅ 自定义需检测的关键词列表（支持中英文、符号、空格等任意文本）
    const keywords = ["cheese", "mushroom", "vegan option"];

    // ? 提取页面可见文本内容（兼容主流浏览器）
    const content = document.body.textContent || document.body.innerText;

    // ? 遍历关键词，检查是否至少有一个存在（大小写敏感匹配）
    const foundKeywords = keywords.filter(word => 
        content.includes(word)
    );

    if (foundKeywords.length > 0) {
        console.log(`Matched ${foundKeywords.length}/${keywords.length} keywords:`, foundKeywords);
        alert(`✅ Found at least one keyword:\n${foundKeywords.join('\n')}`);

        // ? 扩展建议：此处可集成 Webhook、桌面通知或 Telegram Bot API 实现免弹窗提醒
        // 示例（需额外配置 CORS 允许）：
        // fetch('https://your-webhook-url.com/notify', {
        //   method: 'POST',
        //   body: JSON.stringify({ event: 'keyword_detected', matches: foundKeywords }),
        //   headers: { 'Content-Type': 'application/json' }
        // });

    } else {
        console.log("❌ None of the keywords found — reloading page.");
        window.location.reload();
    }
});

? 关键改进说明：

使用 const 和语义化变量名提升可读性与安全性；
采用 Array.prototype.filter() 替代传统 for 循环，代码更简洁且天然返回所有匹配项（便于后续精准反馈）；
includes() 比 indexOf() !== -1 更直观易懂（ES6+ 环境推荐）；
日志输出包含匹配数量与具体词汇，便于调试与审计；
注释中标注了生产级扩展路径（如 API 通知），避免阻塞用户操作。

⚠️ 注意事项：

该脚本默认区分大小写。如需忽略大小写，请将 content.includes(word) 改为 content.toLowerCase().includes(word.toLowerCase())；
若页面内容为异步加载（如 SPA 应用），需配合 MutationObserver 或定时轮询，而非仅监听 load 事件；
频繁刷新可能触发网站反爬机制，请根据实际需求添加随机延迟（如 setTimeout(() => location.reload(), Math.random() * 5000)）；
在 Tampermonkey 中安装后，建议开启「运行在沙箱外」（@grant none）以确保 alert() 正常生效。

掌握此模式后，你可轻松将其封装为可复用函数，甚至结合 localStorage 记录历史匹配状态，构建轻量级网页监控系统。