浏览器扩展开发：如何用JavaScript对网页源码执行正则匹配？

你的思路完全没问题，不过代码里有个容易忽略的拼写错误导致没成功——document.innerHtml应该是document.innerHTML（注意HTML的第二个字母是大写的）。

修正后的基础匹配代码 #

先试试这段修正后的代码，它能匹配整个页面HTML中的目标内容（包括script标签、类名里的内容）：

// 获取页面完整HTML并执行正则匹配
const matchResult = document.innerHTML.match(/(b|cd)ef/);
if (matchResult) {
  const matchedCode = matchResult[0];
  console.log("找到匹配内容：", matchedCode);
} else {
  console.log("未找到匹配的内容");
}

针对特定区域的匹配（比如仅script标签） #

如果你想专门查找script标签内的代码，可以遍历页面上所有script元素，单独匹配它们的内容：

// 遍历所有script标签，检查内部代码
document.querySelectorAll('script').forEach(scriptEl => {
  const scriptContent = scriptEl.textContent || scriptEl.innerText;
  const scriptMatch = scriptContent.match(/(b|cd)ef/);
  if (scriptMatch) {
    console.log("在script标签中找到匹配：", scriptMatch[0]);
  }
});

浏览器扩展的权限配置 #

别忘了在你的扩展manifest文件里配置正确的权限，确保脚本能访问目标页面的DOM。以Chrome扩展Manifest V3为例，需要添加content_scripts字段：

{
  "manifest_version": 3,
  "name": "代码匹配工具",
  "version": "1.0",
  "content_scripts": [
    {
      "matches": ["<all_urls>"], // 可以替换成你需要匹配的特定域名，比如"https://*.example.com/*"
      "js": ["content.js"] // 存放上述匹配代码的脚本文件名
    }
  ]
}

这样配置后，扩展会在匹配的页面加载时自动运行你的脚本，执行正则匹配操作。

内容的提问来源于stack exchange，提问作者NickP