如何打开浏览器扩展（浏览器扩展开发系列教程（一））

以谷歌内核的浏览器扩展                   ，包括 edge chrome 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
，还有我们常用的国产浏览器都能使用

浏览器扩展是一种软件

















，以增强Chrome内核浏览器的功能
  
  
  
  
  
  
  
  
  。浏览器扩展使用HTML
  
  
  
  
  
  
  
  
  、JavaScript  
  
  
  
  
  
  
  
  
 、CSS和图片等Web技术开发  
  
  
  
  
  
  
  
  
 。

浏览器扩展与浏览器插件不同
 


 


 


 


 


 


 


 


 


。浏览器扩展无需了解浏览器的源代码 
  
  
  
  
  
  
  
  
  ，而浏览器插件是更底层的浏览器功能扩展
  
  
  
  
  
  
  
  
  
，需要深入掌握浏览器的源代码
 
 
 
 
 
 
 
 
 。

以谷歌内核的浏览器扩展的基本组成

浏览器扩展
 


 


 


 


 


 


 


 


 

，至少包括一个manifest.json和一个js文件

浏览器扩展
   
   
   
   
   
   
   
   
   
，通常还可以包括图标
 


 


 


 


 


 


 


 


 


、页面和CSS等资源

注意：控制popup窗口或options窗口的分别是popup.js和options.js文件

作为一个浏览器扩展                  ，上述所有文件应该都位于一个根目录之下

 
 

 
 

 
 

 
 

 
 

 
 

 
 

 
 

 
 
，各个不同类型的文件可以位于不同的子目录下
 

 

 

 

 

 

 

 

 

。

3.浏览器扩展的部署运行

浏览器扩展的运行无需依赖任何Web服务器

 

 

 

 

 

 

 

 

 。Chrome浏览器可以方便地进行部署
 
 
 
 
 
 
 
 
 、测试和运行                   。未打包之前是以下面形式安装
 
 

 
 

 
 

 
 

 
 

 
 

 
 

 
 

 
 

。

下面是个示例

name就是程序名称

version是版本

manifest_version是2（如果是1会提示版本低）

description是扩展描述

permissions是权限,后面是匹配的网址

















。

icons是图标

content_scripts是加载的js

browser_action这是显示在浏览器插件栏的icon以及点击icon弹出的页面