写了一个简单的FireFox插件

喜欢用FireFox,不是因为标签浏览和速度快,只是因为上面的插件很多,比如del.ico.us, View in IE,gladder等等。虽然这些插件的功能很简单,但却大大简化了一些常见的操作。但总有些需求不是每个人必须的,比如看到别人提到一本书一部电影,就想到顺手到豆瓣里查找一下,并收藏。以往都是,打开一个新的浏览器窗口,输入豆瓣地址,再粘贴关键字进行检索。虽然也不是很麻烦,但是为什么不是右键点击开始搜索?类似的功能已经有了,比如在Google搜索关键字......好吧,我也写一个插件吧。

FireFox插件的编写其实很简单,只要会XML和HTML的基础知识,以及Javascript语言即可。照着 例子,步步为营,很快搞定。

首先写一个插件的描述文件(install.rdf)。
<? xml version="1.0" ?>
< RDF  xmlns ="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
     xmlns:em
="http://www.mozilla.org/2004/em-rdf#" >

  
< Description  about ="urn:mozilla:install-manifest" >
    
< em:id > mydouban@optman.net </ em:id >
    
< em:version > 1.0 </ em:version >
   
    
<!--  Target Application this extension can install into, 
         with minimum and maximum supported versions. 
-->  
    
< em:targetApplication >
      
< Description >
        
< em:id > {ec8030f7-c20a-464f-9b0e-13a3a9e97384} </ em:id >
        
< em:minVersion > 1.5 </ em:minVersion >
        
< em:maxVersion > 2.0.0.* </ em:maxVersion >
      
</ Description >
    
</ em:targetApplication >
   
    
<!--  Front End MetaData  -->
    
< em:name > my douban </ em:name >
    
< em:description > Search book, video and music on douban </ em:description >
    
< em:creator > optman/em:creator>
    
< em:homepageURL > http://blog.csdn.net/optman </ em:homepageURL >
  
</ Description >       
</ RDF >

其次写一个资源的描述文件(chrome.manifest)

content     mydouban    chrome/content/
overlay chrome://browser/content/browser.xul chrome://mydouban/content/mydouban.xul

在XUL文件里,通过overlay的方式插入新的UI元素(mydouban.xul)。

<? xml version="1.0" ?>
< overlay  id ="google-gnotes-overlay"
  xmlns
="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" >

< popup  id ="contentAreaContextMenu" >
    
< menuitem  id ="searchindouban"  label ="Search in douban"  oncommand ="mydouban.launch(event)" />
</ popup >
    
< script  type ="application/x-javascript"  src ="mydouban.js" />     

</ overlay >

在JS文件里,实现响应代码(mydouban.js)

window.addEventListener( " load " , function (){mydouban.init();}, false );  //  call this function on opening a window
var  mydouban = {
init: 
function (){  //  sets up event listeners
    document.getElementById( " contentAreaContextMenu " ).addEventListener( " popupshowing " function (){mydouban.context();},  false );  //  call context() when the context menu is opened
},
context: 
function (){  //  control which context menu item is show
    
    document.getElementById(
" searchindouban " ).hidden =! gContextMenu.isTextSelected || gContextMenu.onImage || gContextMenu.onTextInput; 

},
launch: 
function (event){window.open( " http://www.douban.com/subject_search?search_text= " + encodeURI(window.content.getSelection()), " doubansearch " , "" )}
}


组织好目录结构,压缩成一个zip包,并改名为xpi后缀,就搞定了。直接拖到FireFox窗口里,就可以直接安装了!

运行的结果就是:



几点注意事项
1. 那就是例子里说的文件保存为Unicode啥的,有问题。如果里面没有中文,全部用ansi保存就好了,否则会有些问题,具体就不多说了。
2. 例子里说,不用安装也能运行,试了一下好像不灵啊。还是先安装,然后到插件安装目录(%APPDATA%/Mozilla/Firefox)下去修改调试吧。

参考:
Mozilla Developer Center
http://developer.mozilla.org/

Building an Extension
http://developer.mozilla.org/en/docs/Building_an_Extension




 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值