• 欢迎访问搞代码网站,推荐使用最新版火狐浏览器和Chrome浏览器访问本网站!
  • 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏搞代码吧

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

asp 搞代码 4年前 (2022-01-03) 40次浏览 已收录 0个评论
首先第一步 说一下怎么样查看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中的,他是安装信息描述。

代码如下:
      
<RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#&quot;
     xmlns:em=”http://www.mozilla.org/2004/em-rdf#”&gt;
  
    [email protected]
    1.0
    2

    <!– Target Application this extension can install into, 
         with minimum and maximum supported versions. –> 
    
      
        {ec8030f7-c20a-464f-9b0e-13a3a9e97384}
        1.5
        2.0.0.*
      
    

    
    blueidea search
    blueidea 
    yaba
    http://bbs.blueidea.com/
    chrome://blueideasearch/content/logo.gif
    http://www.yoursblog.cn/bibar_update.rdf
        

chro来源gaodai#ma#com搞*代#码网me.manifest文件列表描述内容

代码如下:
content     blueideasearch    chrome/content/ 
overlay  chrome://browser/content/browser.xul chrome://blueideasearch/content/overlay.xul

install.rdf中 

代码如下:
     
        {ec8030f7-c20a-464f-9b0e-13a3a9e97384} 
        1.5 
        2.0.0.* 
       

这个em:id是不能变的. 他指明了这个插件的使用对像为 firefox.
em:minVersion 为最低可以安装这个插件的版本 。maxVersion反之. 
 

代码如下:
   blueidea search 
    blueidea  
    yaba 
    http://bbs.blueidea.com/ 
    chrome://blueideasearch/content/logo.gif 
    http://www.yoursblog.cn/bibar_update.rdf 

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) 

以上就是firefox扩展插件制作方法详细介绍的详细内容,更多请关注gaodaima搞代码网其它相关文章!


搞代码网(gaodaima.com)提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请说明详细缘由并提供版权或权益证明然后发送到邮箱[email protected],我们会在看到邮件的第一时间内为您处理,或直接联系QQ:872152909。本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:firefox扩展插件制作方法详细介绍

喜欢 (0)
[搞代码]
分享 (0)
发表我的评论
取消评论

表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址