谷歌浏览器插件是一种小型的用于定制浏览器体验的程序。通过插件，可以自定义浏览器的一些行为来适应个人的需要，只要你会HTML，JavaScript，CSS就可以动手开发浏览器插件了。

开发谷歌浏览器插件，就相当于在谷歌浏览器的基础之上进行活动，站在巨人的肩膀上，操作很多东西都方便了一些。有了插件，我们可以定制js爬虫、屏蔽网页广告，网页实时查词，修改http请求头，等等，能做的东西很多。

配置文件

每个扩展都有一个JSON格式的mainifest文件，叫mainifest.json。

{     "manifest_version": 2, //固定的    "name": "Cissy's First Extension", //插件名称    "version": "1.0", //插件使用的版本    "description": "The first extension that CC made.", //插件的描述    "browser_action": { //插件加载后生成图标        "default_icon": "cc.gif",//图标的图片        "default_title": "Hello CC", //鼠标移到图标显示的文字         "default_popup": "popup.html" //单击图标执行的文件    },     "permissions": [ //允许插件访问的url        "http://*/",         "bookmarks",         "tabs",         "history"     ],     "background":{//background script即插件运行的环境        "page":"background.html"        // "scripts": ["js/jquery-1.9.1.min.js","js/background.js"]//数组.chrome会在扩展启动时自动创建一个包含所有指定脚本的页面    },      "content_scripts": [{  //对页面内容进行操作的脚本         "matches": ["http://*/*","https://*/*"],  //满足什么条件执行该插件          "js": ["js/jquery-1.9.1.min.js", "js/js.js"],            "run_at": "document_start",  //在document加载时执行该脚本    }] }注⚠️：Chrome不允许扩展中的html页面内直接内嵌js脚本，而要求所有的脚本都作为外部的src引入。

简单的浏览器插件基本文件组成

安装调试

设置 —>拓展程序—>加载已解压的拓展程序—>选择文件就行了，记得要打开开发者模式~~

原文链接：https://www.jianshu.com/p/51c650f98d9c + https://segmentfault.com/a/1190000006949838

生活总是不容易的，但生而为人，请善良、请开心 ---时光无法后退，生命只有一次。

chrome 插件开发各种功能demo_Chrome扩展开发-编写一个浏览器插件相关推荐

chrome 插件开发各种功能demo_Chrome 插件开发全攻略
Chrome 浏览器相信大家都用得比较多,有很多的优点,比如简洁.强大的开发者工具等,但是更让大家映像深刻的是有各种各样有趣.有用的插件,今天要给大家推荐的开源项目是 Chrome 插件开发全攻略,你 ...
android浏览器插件开发,【转】Chrome扩展开发自己的浏览器插件
本帖最后由火菩萨于 2017-6-25 03:24 编辑不知道分类对不对不对请管理大大移动一下 wKioL1fiEXCQ9nkKAAEZAaNTxUk841.jpg-wh_651x-s_429 ...
chrome 插件开发各种功能demo_Chrome 开发者工具各种骚技巧
优质文章,及时送达曾经,在线调伪类样式困扰过你? 源代码快速定位到某一行!ctrl + p 联调接口失败时,后台老哥总管你要response? 你还一层层展开dom?Alt + Click 是不是报 ...
java插件开发_编写一个IDEA插件之：自动生成Java代码
我很喜欢IDEA的一键自动生成代码功能,例如自动生成构造方法.字段的Get/Set方法.ToString方法等等,除此之外,也有一些插件提供自动生成代码的功能,例如我们所熟悉的GsonFormat插件 ...
编写一个VSCode插件
原文链接: 编写一个VSCode插件 - 愧怍的小站自从使用过 VSCode 后就再也离不开 VSCode,其轻量的代码编辑器与诸多插件让多数开发者爱不释手.同样我也不例外,一年前的我甚至还特意买本 ...
如何开发一个浏览器插件
参考文章 Chrome 平台 API 一天学会Chrome插件开发 30分钟开发一款抓取网站图片资源的浏览器插件 manifest.json参数详解 Content Security Policy 入 ...
如何编写一个Jquery插件
首先我们来搞清楚一些关于Jquery插件的知识: 一.插件的种类: 封装对象方法的插件这种插件是将对象方法封装起来,用于对通过选择器获取的jQuery对象进行操作,是最常见的一种插件封装全局函数的 ...
编写一个IDEA插件之：事件监听
事件监听,我们最熟悉不过的就是开发APP时,监听按钮点击事件.手指触摸及移动事件.网络状态事件等等.事件监听大多通过观察者模式实现,首先API调用者不需要知道后台是如何检测出网络状态不可用的,而只需要 ...
从零开始编写一个vue插件
title: 从零开始编写一个vue插件 toc: true date: 2018-12-17 10:54:29 categories: Web tags: vue mathjax 写毕设的时候需要一 ...
WordPress插件开发教程1：开发第一个WordPress插件
一.创建一个插件第一步:在 wp-content \ plugins 目录新建一个目录,随便起个名字,比如:my-first-plugin. 第二步:进入 my-first-plug ...

chrome 插件开发各种功能demo_Chrome扩展开发-编写一个浏览器插件

配置文件

简单的浏览器插件基本文件组成

安装调试

chrome 插件开发各种功能demo_Chrome扩展开发-编写一个浏览器插件相关推荐

最新文章

热门文章