`
lorrylockie
  • 浏览: 10957 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
最近访客 更多访客>>
社区版块
存档分类
最新评论

chrome 插件初学开发

 
阅读更多

 

这两天学习了chrome的插件开发,发现写插件是个很有意思的事情,可以很轻松的满足很多日常的小需求。提高工作效率。 下面简单分享下这两天写的两个插件以及背后的需求点。

 

插件1:automan小工具

 

需求:公司测试团队automan经常需要用jquery的选择器来定位页面的元素,但测试人员通常不是每个人都懂前段,也经常要通过一些繁琐的步骤,来确定自己写的选择器是否能正确的选择他想要选择的元素。

 

功能实现:在插件上填写测试人员编写的选择器,在页面上会自动高亮提示选择器所选择到的元素,编写实现非常简单,就是把插件中填写的selector在页面中用$('selector') 查询一下并且高亮

 

截图: 


 

 

下载地址:http://data.vdisk.me/225892/3b66424d0b844b422b5436e8ec2d7b435df81283?ssig=tVjlLeZxmQ&Expires=1307359925&KID=sae,l30zoo1wmz&qc=5&fn=timer.crx(不推荐下载,因为对适用范围有限)

 

 

 

插件2:

 

需求:  http://vdisk.weibo.com/ 就是微盘,新浪下面的一个基于社交网络的文件分享系统,但使用过程中,发现页面中没有直接的下载地址,有的时候想把文件的下载链接直接弄出来,因为有可能需要外链,更方便一点,所以想到写一个插件,提取页面中的链接地址。

 

功能实现:能够提取页面中的所有微盘文件的链接地址,所有人都可以直接通过链接地址下载,不需要登陆等等,不需要分享等等.....仅供学习(呵呵,这个微盘管理员知道了,肯定会不同意的)

 

截图: 


 

 

下载地址:http://data.vdisk.me/225892/2187b6e10f0dcac8652bb1917a563a8bc2f9bcd6?ssig=xmWOanT8qr&Expires=1307360443&KID=sae,l30zoo1wmz&qc=5&fn=vdisk.crx

(推荐下载适用,呵呵,算是帮v盘做一个宣传)

 

 

另外附上我的插件源码:

 

下载地址: http://data.vdisk.me/225892/9432cf814eacbc1b044d1663985ebafadbd1797c?ssig=7G682k%2F0Tx&Expires=1307360599&KID=sae,l30zoo1wmz&qc=5&fn=chrome.zip

 

推荐两个网站:

 

入门资料中文:http://dev.chromechina.com/     入门学习,中文的好看一些

深入学习官方:http://code.google.com/chrome/extensions/index.html   官方api,入门后看官方api会更容易理解

  • 大小: 75.5 KB
  • 大小: 200.1 KB
1
0
分享到:
评论
发表评论

文章已被作者锁定,不允许评论。

相关推荐

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

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

    chrome插件开发文档

    通过以上介绍,我们可以了解到Chrome插件开发的基本流程和关键点,这对于初学者来说是一个很好的入门指导。随着实践经验的积累,开发者可以进一步探索更多高级功能和技术细节,不断优化和完善自己的插件作品。

    Chrome插件开发完整demo

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

    Vue3开发Chrome插件时popup-content-background之间的通信API组合和实现

    本程序为作者使用vue3开发chrome插件时实践各个通讯API后,总结的相互之间无干扰的高效数据传输API组合,程序使用vscode可直接打开,npm install安装node_modules文件夹后直接点击NPM工具中的watch或build开始对插件...

    CSDN_chrome插件

    总的来说,CSDN_chrome插件通过集成多种开发资源,为开发者打造了一个一站式的技术服务平台,使他们在谷歌浏览器中就可以完成大部分开发和学习任务,提升了开发工作的便捷性和效率。对于使用Chrome浏览器的程序员来...

    chrome插件API中文版

    对于初学者,理解并熟练运用这些API是开发Chrome插件的关键。中文版的Chrome插件API文档能够帮助中国开发者更好地理解这些概念,避免语言障碍,从而更快地学习和开发出自己的插件。在实际开发过程中,开发者可以根据...

    Chrome浏览器的vue开发插件

    对于初学者,了解和掌握Vue DevTools的使用是提高开发效率的关键一步。熟练运用Vue DevTools可以帮助开发者快速定位问题,理解组件间的数据流动,优化性能,从而提升整体开发体验。在进行web开发时,尤其是使用Vue....

    谷歌浏览器插件开发代码demo | google-chrome-plugin-demo.zip

    本压缩包"google-chrome-plugin-demo.zip"包含了一个完整的Chrome插件开发代码示例,名为"full-chrome-plugin-demo",非常适合初学者和开发者探索和学习如何构建自己的Chrome插件。 1. **Chrome插件结构**: ...

    简单的chrome插件示例

    这个"简单的chrome插件示例"是一个基础的开发案例,对于初学者来说,它是了解如何构建Chrome插件的好起点。 Chrome插件由几个关键组件构成: 1. **manifest.json**:这是每个Chrome插件的核心文件,它定义了插件的...

    给 CSDN 博客开发 Chrome 插件-阅读时间-源码

    欢迎来到我的 Chrome 插件系列教程。 通过本文,你将学到 Chrome 插件以下内容: 1. 扩展manifest。 2. 扩展程序使用的图标大小。 3. 如何使用内容脚本将代码注入...1. Chrome 插件初学者 2. 前端开发 3. 初级程序员

    配合ES使用-chrome插件sense

    总的来说,"配合ES使用-chrome插件Sense"是一个方便开发和管理Elasticsearch的工具,它简化了与ES交互的过程,提高了工作效率。如果你经常处理Elasticsearch的数据,那么掌握如何有效使用Sense将对你的工作大有裨益...

    给 CSDN 博客开发 Chrome 插件-专注模式-源码

    欢迎来到我的 Chrome 插件系列教程。 通过本文,你将学到 Chrome 插件以下内容: 1. 使用扩展服务工作者作为事件协调器。 2. 通过 activeTab 权限保护用户隐私。...1. Chrome 插件初学者 2. 前端开发 3. 初级程序员

    chrome插件开发法

    Chrome插件开发是一个涉及多方面知识的领域,包括前端开发、浏览器API理解和Web标准遵循等。 在开发Chrome插件时,首先需要理解的是Chrome扩展的架构。一个基本的Chrome插件通常包含以下几个部分: 1. **manifest....

    给 CSDN 博客开发 Chrome 插件-标签管理-源码

    欢迎来到我的 Chrome 插件系列教程。 通过本文,你将学到 Chrome 插件以下内容: 1. 使用 Action API 创建扩展弹出窗口。 2. 使用选项卡 API 查询特定选项卡。...1. Chrome 插件初学者 2. 前端开发 3. 初级程序员

    Chrome获取书签插件工程文件(提取)

    总之,这个压缩包为初学者提供了一个实战性的学习平台,让他们能够亲手实践Chrome插件的开发,了解书签管理插件的工作方式,并掌握Web开发中的基本技能,如HTML、CSS和JavaScript。同时,对于经验丰富的开发者来说,...

    gliffy 流程图 chrome插件

    总的来说,Gliffy流程图Chrome插件是Java开发环境中一个高效且实用的工具,它简化了流程图的创建流程,增强了Web应用的图表功能,并通过API接口为开发者提供了更多的可能性。无论你是需要为项目文档添加图表,还是...

    chrome插件 例子

    Chrome插件,也被称为Chrome扩展,是Google Chrome浏览器上的应用程序,它们可以增强或修改...记得实践是最好的老师,动手尝试每个例子,理解其背后的逻辑和实现方式,相信你会在Chrome插件开发的道路上更进一步。

    给 CSDN 博客开发 Chrome 插件-基础知识-源码

    欢迎来到我的 Chrome 插件系列教程。 通过本文,你将学到 Chrome 插件的基本概念;了解了插件核心 manifast 文件的结构、字段含义;最后,通过一个 hello extension ...1. Chrome 插件初学者 2. 前端开发 3. 初级程序员

    chrome 插件vuedevtools 6.1.4

    标题中的"chrome 插件vuedevtools 6.1.4"指的是Vue DevTools的6.1.4版本,这是一个针对Chrome浏览器的扩展程序。这个版本可能包含了对Vue.js框架的最新支持,修复了之前版本的一些问题,并可能引入了新的特性或优化...

Global site tag (gtag.js) - Google Analytics