firefox扩展插件制作方法详细介绍

首先第一步 说一下怎么样查看firefox插件的源码, 就我上边写的那个东西,把它下载下来.将它的扩展名改为zip并解压。会得到一个blueideaserach的文件夹, 这个文件夹中便是我做的这个插件的源码[attach]62937[/attach]

这个目录中除了 chrome目录  chrome.manifest install.rdf  这三个以外都不是必须的。

chrome.manifest   这个文件中是对所有文件的一个列表.

install.rdf             这个是安装信息的描述.

chrome目录中放的是主程序.  


这个整个目录结构是这样的.

     blueideasearch-----
           --------chrome
                    -----content
                               --overlay.xul
                               --overlay.js
            --------chrome.manifest
            ---------install.rdf


也就是说 只要按这个目录结构建好. 并压缩成zip包 改名为xpi  它便可以在firefox中安装了. 

overlay.xul 文件中是对插件的人UI描述。
overlay.js   是程序的处理部分.
下边这个代码是install.rdf中的,他是安装信息描述。

chrome.manifest文件列表描述内容

install.rdf中 

这个em:id是不能变的. 他指明了这个插件的使用对像为 firefox.
em:minVersion 为最低可以安装这个插件的版本 。maxVersion反之. 
 
em:name 是插件的名称。
   em:description  描述
   em:creator      作者
   em:homepageURL  主页
   em:iconURL     图标地址
   em:updateURL       查找更新地址

了解了上边的内容,就可以进行插件的编写了.  firefox它本身是基于Mozilla 框架开发的。 

大家可以在FF的地址栏输入以下地址 chrome://browser/content/browser.xul  来看一下 FF的本身自己的UI的描述 

在这里推荐大家用fireBug 来查看.. 可以清楚看到浏览器的DOM结构. 我们以后的操作都要针对这个DOM结构.

大家看到我们说要对插件UI描述的文件扩展名为.xul  对这xul语言 大家可以参考http://www.xulplanet.com/  这个网站..它里有XUL详细介绍。把它理解成一种HTML就可以了. 他的语法标记十分简单易懂。 
     
这对FF上  对 "主页" 这个按钮的描述。 
      
这是对FF“地址栏”描述
大家看是不是特别像HTML. 我们开始写插件的UI吧 。。 
     打开\chrome\content\overlay.xul 文件. 
  

 就理解成.在写HTML时加入的那一句声明吧. 
     这是程序的处理部份.  就像在写HTML是引入JS一样.
   哧哧,是不是越来越像在写网页了.

    我们要确定插件要出现的位置. 比如我们的插件要出现在地址栏下边. 我们可以用FireBug来查看刚才我给的那个chrome的地址. 找到地址栏,并查看它的父结点.
    这里我查到地址栏的父结点为
    我们就这样写: 
 

复制代码 代码如下:

         
     
         
                 
           

    
这个代码呢..是在下追加一个子节点 toolbarbutton 是一个按钮   oncommand是它的一个事件,当按下它时触发这个事件. 里边的响应的函数就在我们一开始引入的那个JS里. 
 

复制代码 代码如下:

     /** 
* 在当前窗口中打开链接。 
*/ 

function GotoWebSite(url){ 

    loadURI(url) 

}