如何使用chrome扩展名修改页面上的所有链接

How to modify all links on page with chrome extension?

本文关键字：链接 何使用 chrome 扩展名 修改      更新时间：2023-09-26

我正在自学如何编写Chrome扩展程序，但是我甚至无法启动和运行基本功能。

我正在尝试编写一个扩展来修改给定页面上的所有链接。作为概念证明，我正在尝试修复它，以便google.ca结果页面上的所有链接都指向www.gooogle.cn

这是我的manifest.json：

"name": "Google Link Fixer",
  "version": "0.1",
  "permissions": ["*://www.google.*/*"],
  "content_scripts": [
    {
      "matches": ["*://www.google.*/*"],
      "js": ["jquery.js", "content_script.js"]
    }
  ],
  "manifest_version": 2
}

这是 content_script.js 中的 javascript（请注意jquery.js在同一个目录中）：

$(document).ready(function(){
$("a[href^='https://www.google.ca']")
   .each(function()
   { 
      this.href = this.href.replace(/^https:'/'/www'.google'.ca/, 
         "https://www.google.cn");
   });
});

和。。。无。我可以在开发人员工具中看到正在加载扩展，并且代码位于内容脚本下，但我没有看到预期的结果。任何帮助，不胜感激。

我希望

我能将@charlietfl给出的答案标记为正确的答案。它让我走上了正确的轨道。

我的脚本有两个问题：

  1. 我用作概念证明的Google搜索结果页面使用相对链接，而不是绝对链接，因此我的替换函数（正确）找不到正则表达式模式/^https:'/'/www'.google'.ca/。教训：不要指望谷歌提供的"简单"页面有简单的HTML。

  2. 据我所知，谷歌至少会动态创建一些链接——这种模式在其他网站上也很常见。我在专用的点击处理程序中重写了脚本，这就是让我走上正轨的原因。教训：仔细想想你要完成什么。我没有试图更改页面上的所有链接;我想重定向某些链接指向的位置。在链接点击级别比在全页面级别进行行为修改更有效 - 并且更容易完成。

我使用的代码是： 

$(document).on("click", "a", function(){
    var link_target = $(this).attr('href');
    var converted_url = link_target.replace(/SOME_REGEX/, REPLACEMENT_TEXT);
    $(this).attr('href', converted_url);
});
相关文章：