如何使用我自己的 chrome 扩展程序修改网站 html？

如何解决如何使用我自己的 chrome 扩展程序修改网站 html？

我想使用我的 chrome 扩展程序自动修改网站 html。在我的 JS 代码中，我的代码有限，因为我不知道如何浏览网站上的每一行 html 并更改值。

澄清一下，我不是在问如何将 JS 链接到 HTML 或任何类似的东西。我在问如何访问 gmail 或 youtube 等网站并使用我的 JS 文件修改客户端 html 代码。假设我有一些元素 ID，我该如何编辑该 ID 的值？我尝试浏览 google chrome 的扩展参考表和文档，但找不到我的问题的答案，但找到了阻止 url 的方法。

一些次要问题：

chrome.webRequest.onBeforeRequest.addListener 如何工作？ “详细信息”参数如何工作？

我开始通过编写以下代码来解决这个问题，因为我已经制作了一个 manifest.json 并相应地链接了它。对不起，如果这真的很简单或者我的代码没有意义，因为我试图查看其他人的示例并复制它。

JS 文件：

chrome.webRequest.onBeforeRequest.addListener(
   function(details){

     
       
       {urls: catalog.js}
   }
)

manifest.json

{
    "name": "Test Extension","description": "Learning how to make google extensions","manifest_version": 2,"version": "1.0","background": {
        "scripts": ["main.js","catalog.js"]
    },"permissions": ["webRequest","webRequestBlocking","background"]
    
}