`
leeqq
  • 浏览: 138158 次
  • 性别: 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插件开发完整demo

    这个"Chrome插件开发完整demo"提供了一个完整的实例,帮助开发者深入理解如何构建自己的Chrome扩展。下面,我们将详细探讨Chrome插件开发的相关知识点。 1. **Chrome插件架构** Chrome插件由几个关键组件组成:`...

    chrome插件开发入门教程

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

    chrome插件开发文档

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

    chrome插件开发-页面对象注入及本地通信

    在本主题"chrome插件开发-页面对象注入及本地通信"中,我们将深入探讨两个关键概念:页面对象注入和本地通信,这两个概念是Chrome插件开发中的重要组成部分。 **页面对象注入** 页面对象注入是指将JavaScript对象或...

    Chrome插件开发--后台监控网页并自动刷新,点击页面元素

    在这个特定的案例中,我们关注的是一个能够后台监控网页并自动刷新,以及点击页面元素的Chrome插件开发。这种插件对于开发者调试网页或者自动化测试来说非常有用。 首先,我们要了解Chrome插件的基本结构,它通常...

    chrome 插件开发各种功能demo

    在"chrome-plugin-demo-master"这个项目中,你应该能通过实践这些示例,掌握Chrome插件开发的基本技巧,从而开发出自己的插件,满足特定需求。记得在开发过程中遵循Chrome的开发者政策,确保插件的安全性和合规性。

    Chrome插件开发完整教程

    【Chrome插件开发完整教程】 在互联网世界里,Chrome插件(或称为Chrome扩展)是一种利用Web技术(如HTML、CSS、JavaScript等)构建的软件,用于增强浏览器的功能。Chrome插件可以让你根据个人需求定制浏览器,实现...

    Chrome插件开发3.0

    Chrome插件开发3.0是关于构建和优化Google Chrome浏览器扩展程序的一门技术主题。随着互联网的快速发展,浏览器插件已经成为提升用户体验、增强浏览器功能的重要工具。Chrome作为全球最受欢迎的浏览器之一,其丰富的...

    Chrome插件开发

    Chrome插件开发允许开发者为用户提供定制化的浏览体验,比如广告拦截、网页翻译、效率工具等。 在开发Chrome插件时,你需要了解以下几个核心概念: 1. **manifest.json**:这是每个Chrome插件的核心文件,它定义了...

    Chrome Extension (Chrome插件)开发官方最新文档(20190401)

    以下是对Chrome插件开发的详细解释: 一、基础概念 1. **Manifest文件**:每个Chrome插件都有一个manifest.json文件,它是插件的核心配置文件,包含了插件的基本信息、权限、内容脚本、背景页面等设置。 2. **内容...

    浏览器 chrome 插件开发

    在Chrome插件开发中,主要涉及以下几个核心概念: 1. **Manifest文件**:每个Chrome插件都必须有一个`manifest.json`文件,它是插件的配置文件,包含了插件的基本信息,如名称、版本、权限、图标、内容脚本、背景...

    chrome插件开发用

    下面我们将深入探讨Chrome插件开发的相关知识点。 首先,了解Chrome插件的基础架构至关重要。一个基本的Chrome插件通常包含以下几个部分: 1. **manifest.json**:这是每个Chrome插件的核心文件,它定义了插件的...

Global site tag (gtag.js) - Google Analytics