【Firefox扩展】简单扩展之2——overlay menupopup

简单扩展之2——overlay menubar
上一篇blog介绍了状态栏的扩展，这篇将介绍简单的菜单栏，扩展已有的菜单栏——Tool菜单栏，原理和扩展状态栏一样，只不过有一点需要提到，我们在下载firefox扩展的时候，解压后会发现他们的chrome目录下，会是一个jar文件，可以说这是标准做法，我们只要在原有的基础上稍加改动就可以了。（不过我觉得不用jar包也不错，开发时省去了打包的步骤）

先说install.rdf文件吧。和扩展状态栏没有什么区别，只不过名字不同而已，可以根据自己的喜好起名字，照着填上就好了，就不贴代码了（我现在在考虑可不可以自己写一个简单的IDE，做出一个文件模板，在其中把必须的标签写出来，然后我们在做开发的时候只用填一填作者啊，扩展名啊之类的东西）。

然后是chrome.manifest文件，语法格式还是一样，只不过我们想更标准一点，那么我们写成jar包的形式，代码如下：


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


content sample jar:chrome/sample.jar!/content/



区别也很明显，就是在注册部分会有一个jar:的字样和.jar!包的字样，其他的都没有什么变化。其中“jar:”用来标示指向的是一个jar包的内部地址。

接下来是overlay.xul文件，代码如下：


<?xml version="1.0"?>


<overlay id="sample"


xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">




<script type="application/x-javascript" src="overlay.js"/>




<menupopup id="menu_ToolsPopup">


<menuitem id="getcurrenturl" label="CurrentURL" oncommand="getURL();"/>


</menupopup>




</overlay>

有三处需要说明：
1.javascript的脚本声明：type写成application/x-javascript表示js脚本，src表示当前xul文件要用到的js脚本的位置，这里用的是相对地址，根据习惯，js文件和xul文件放在同一个文件夹——content文件夹下。
2.我们想像其他扩展一样，在Tool菜单下加入一些东西，就必须将menupopup这个标签的id设置成menu_ToolsPopup，这是火狐浏览器本身的一个界面元素。在这里我们添加一个id为getcurrenturl的项，他显示的名称为label内容“CurrentURL”。
3.oncommand，事件处理，表示我们点击了这个item后，要用什么来响应这个点击的操作，这里我们调用了js脚本中的函数getURL（）；

最后是overlay.js文件，代码如下：


function getURL()
{
alert(window.content.document.location.href);
}

也是相当简单，就一句话，作用是取得当前页面的url。不过这一句让我发愁了一个上午，原因是：标准的javascript中，取得当前页面的url方法很多，其中最简单一句就是document.location.href；但是我们覆盖了browser.xul这个文件，如果按照这个标准写法，他会把browser.xul以chrome形式显示出来。到MDC上找了半天，才找到覆盖的写法，加上一个content。真无语啊~

哦了，将content目录以zip形式打包成sample.jar文件，然后放在chrome目录下，可以删掉sample目录了，然后打包根目录成sample.xpi，在firefox中安装，试试吧~
目录结构如下：
/chrome
---/sample.jar
/install.rdf
/chrome.manifest
sample.jar包中的内容如下：
---/content
---/overlay.xul
---/overlay.js

最后附上javascript中几种取得当前页面下URL的方法：
1.document.domain;
2.window.location.href;
3.document.URL;
4.document.location.href;
5.self.location.href;
6.document.location;
7.top.location.href;
8.parent.document.location;
......