firefox扩展插件制作方法

firefox扩展插件制作方法

ZDNET网络频道时间：2008-07-24作者：巧巧读书| 巧巧读书

本文关键词：火狐火狐浏览器Firefox

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

这个目录中除了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中的,他是安装信息描述。

xmlns:em="https://www.wendangku.net/doc/d918369373.html,/2004/em-rdf#">

yabaxx@https://www.wendangku.net/doc/d918369373.html,

1.0

2

with minimum and maximum supported versions. -->

1.5

2.0.0.*

blueidea search

blueidea

yaba

https://www.wendangku.net/doc/d918369373.html,/ chrome://blueideasearch/content/logo.gif

https://www.wendangku.net/doc/d918369373.html,/bibar_update.rdf

chrome.manifest文件列表描述内容

content blueideasearch chrome/content/

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

install.rdf中

1.5

2.0.0.*

这个em:id是不能变的. 他指明了这个插件的使用对像为Firefox.

em:minVersion 为最低可以安装这个插件的版本。maxVersion反之.

blueidea search

blueidea

yaba

https://www.wendangku.net/doc/d918369373.html,/

chrome://blueideasearch/content/logo.gif https://www.wendangku.net/doc/d918369373.html,/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语言大家可以参考https://www.wendangku.net/doc/d918369373.html,/这个网站..它里有XUL详细介绍。把它理解成一种HTML就可以了. 他的语法标记十分简单易懂。

这对FF上对"主页" 这个按钮的描述。

completeselectedindex="true" tabscrolling="true" showcommentcolumn="true" enablehistory="true" oninput="https://www.wendangku.net/doc/d918369373.html,erTypedValue = this.value" ontextentered="return handleURLBarCommand(param);" ontextreverted="return handleURLBarRevert();">

onclick="PageProxyClickHandler(event);">

id="page-proxy-button"

ondraggesture="PageProxyDragGesture(event);" tooltiptext="拖放此图标以创建到此页面的链接"/>

position="after_end" onpopupshowing="return FeedHandler.buildFeedList(this);" oncommand="return FeedHandler.subscribeToFeed(null, event);" onclick="checkForMiddleClick(this, event);"/>

这是对FF“地址栏”描述

大家看是不是特别像HTML.

我们开始写插件的UI吧。。

打开chromecontentoverlay.xul 文件.