`
leeqq
  • 浏览: 139390 次
  • 性别: Icon_minigender_1
  • 来自: 南京
社区版块
存档分类
最新评论

chrome插件开发

    博客分类:
  • web
阅读更多

最近看了下Chrome插件的开发
新建一个目录作为插件的要目录,在目录下新建 manifest.json文件

{
    "name": "我的插件",
    "version": "0.1",
    "manifest_version": 2,
    "description": "看看我的插件",
    "icons": {
        "16": "statics/img/16.png",
        "48": "statics/img/48.png",
        "128": "statics/img/128.png"
    },
    "browser_action": {
        "default_icon": "statics/img/16.png",
        "default_title": "我的插件",
        "default_popup": "template/pop.html"
    },
    "permissions": [
        "tabs", "http://*/"
    ],
    "homepage_url": "http://leeqq.iteye.com"
}

 
 "browser_action" -> "default_popup" 指向 插件的弹窗页面,如

 
在 template/pop.html中引入 ../statics/js/pop.js

绑定  事件
    

    var get = document.getElementById('get');
    get.addEventListener('click', function () {
        chrome.tabs.insertCSS({file:'statics/css/insert.css'});
    })
    
    var update = document.getElementById('update');
    update.addEventListener('click', function () {
        chrome.tabs.executeScript({file: 'statics/js/insert.js'}, function () {
        });
    });
    
    var create = document.getElementById('create');
    create.addEventListener('click', function () {
        chrome.tabs.create({
            index: 3,
            url: 'template/newpage.html',
            selected: false
        }, function (tab) {
            console.log(tab);
        })
    });

 
分别是往当前页面注入css,js和打开新的tab

 

在Extension页面点击 Load unpacked extensions,选择要目录安装插件


 
这里的api不多做介绍,可以参照网上的api,这里附上360的平台地址
http://open.chrome.360.cn/extension_dev/overview.html
或者访问chrome官网
https://developer.chrome.com/extensions

附件里附上个小例子 myPlugin

  • 大小: 10.4 KB
  • 大小: 23.4 KB
分享到:
评论

相关推荐

    chrome插件开发文档-详细pdf版.7z

    总之,"chrome插件开发文档-详细pdf版"是学习和精通Chrome插件开发的宝贵资源,无论你是初学者还是有经验的开发者,都能从中受益。通过深入研究这份文档,你将能够创建出功能强大、用户体验优良的Chrome插件,丰富你...

    Chrome插件开发.pdf

    Chrome 插件开发概述 Chrome 插件开发是指在 Google Chrome 浏览器上开发小程序的过程,这些小程序可以增强浏览器的功能,提供更多的功能和服务。下面是 Chrome 插件开发的基本概念和步骤: 一、基本概念 * ...

    chrome插件开发 - tab页面切换插件

    Chrome插件开发是一个充满创新和实用性的领域,它允许开发者为全球最大的网络浏览器之一——Google Chrome,添加自定义功能和增强用户体验。在这个“chrome插件开发 - tab页面切换插件”项目中,我们关注的焦点是...

    chrome插件开发,完整demo

    chrome插件开发,完整demo,包含 这是一个popup页面! background 打开background 调用background页JS方法 获取background页的标题 设置background页标题 (验证background生命周期和单实例特性) 窗口操作演示 新窗口...

    chrome插件开发入门教程

    Chrome 插件开发入门教程 Chrome 插件开发入门教程旨在帮助开发者快速了解 Chrome 插件的开发流程和基本概念。下面是本教程的知识点总结: 1. Chrome 插件开发的基本概念 Chrome 插件是一个小型的程序,可以增强...

    chrome插件开发文档

    ### Chrome插件开发知识点 #### 一、Chrome插件开发基础概述 - **定义与作用**:Chrome插件(或称扩展程序)是基于Web技术(HTML、CSS、JavaScript等)构建的小型应用程序,用于增强浏览器的功能性。通过安装插件...

Global site tag (gtag.js) - Google Analytics