通过Javascript code modules在XUL文件之间使用全局变量

　　学习Firefox扩展开发,发现不同的XUL窗体对应的js脚本之间是无法使用全局变量的,如果要使用全局变量就必需通XPCOM组件来实现,后来在网上搜索到一论坛有人问到如何在XUL之间使用全局变量,某高人发了一个MDN上的文章链接:Using JavaScript code modules ,看完了才知在Geko1.9(Firefox3)后引入了Javascript Code Modules,只要写一个基于javascript代码的jsm文件,声明好需要使用的全局变量,然后在要用这些全局变量到的js文件中使用Components.utils.import() 加载这个jsm文件即可,这些在jsm中定义的全局变量不会因为在不同的js文件中调用而被重置,因为这些全局变量被置于缓存中,各个js文件去访问到的都是同一个值.

 

　　引用一下MDN上的例子,首先新建一个叫my_module.jsm的文件(其实后缀也可以是js的,没所谓,只要后面载入的时候文件名一致就可以),写入以下代码.

var EXPORTED_SYMBOLS = ["foo", "bar"]; function foo() { return "foo"; } var bar = { name : "bar", size : "3" }; var dummy = "dummy";

　　第一行定义的数组EXPORTED_SYMBOLS这个名字是固定的,里面的成员应该包括了你希望可以全局使用的项.例如函数foo和封装类bar,不能使用一个单独的变量作为全局输出项,例如上面代码中的dummy,就算被加入到输出项中在其他js脚本中调用修改其值也不会实现全局的效果.所有的但单独变量都要类似bar.size那样封装起来使用.

 

　　接着在一个希望可以用访问并使用全局变量的js脚本文件中加入以下代码:

Components.utils.import("resource://app/my_module.jsm"); alert(foo()); // 显示 "foo" alert(bar.size + 3); // 显示 "6" alert(dummy); // 显示 "dummy is not defined" 因为 'dummy' 并没有被输出为全局变量

　　第一行的Components.utils.import 就是关键所在, 要首先载入了上面的my_module.jsm文件后才能正常使用输出的全局变量.

　　在Geko2(Firefox 4)之前的Components.utils.import 函数只支持 resource:// 和 file:// 两种文件路径,只有在Geko2(Firefox 4)中才会加入 chrome:// 和jar路径的支持. 所以如果目前一般都是使用resource:// 路径.

　　resource://app/my_module.jsm 中的app其实是一个在chrome.manifest中定义的别名 , 例如我们开发的扩展名字叫my_ext,文件结构如下:

my_ext
|   chrome.manifest      # Chrome 注册的清单文件
|   install.rdf          # 扩展安装信息
|
+---content
|       overlay.xul       # 覆盖的界面
|       overlay.js          # overlay调用的js脚本文件
|       my_module.jsm  #jsm文件
|
+---defaults
|   /---preferences
|           exname.js       # 选项的默认值
|
|
/---skin
        overlay.css         # 样式文件

 

　　chrome.manifest文件内容如下,请注意5行的resource就是定义了my_jsm这个别名指向的路径是content文件夹(jsm文件所在文件夹的相对路径)

content my_ext content/ skin my_ext classic/1.0 skin/ overlay chrome://browser/content/browser.xul chrome://my_ext/content/overlay.xul style chrome://global/content/customizeToolbar.xul chrome://my_ext/skin/overlay.css resource my_jsm content/

　　那么在Components.utils.import 中的载入路径就应该为: resource//my_jsm/my_module.jsm. 还要记得Geko2(Firefox 4)之前的扩展中的jsm文件不能压缩到jar文件中,只能独立放出来,否则是无法正常载入的.

 

　　以下的代码是演示在两个不同的变量范围(或者是两个js文件)中使用全局变量:

　　test1.js

Components.utils.import("resource://app/my_module.jsm"); alert(bar.size + 3); // 显示 "6" bar.size = 10;

 

　　test2.js

Components.utils.import("resource://app/my_module.jsm"); alert(foo()); // 显示 "foo" alert(bar.size + 3); // 显示 "13"

　　最后要记得不能直接修改bar的值.

 

　　以上就是关于通过Javascript code modules实现全局变量的方法,如果有需要深入了解JSM可以访问MDN上的Javascript code modules的专题页 .

 

 

转载请保留本行原始出处声明信息 :  http://blog.youkuaiyun.com/forumz/archive/2010/07/07/5719678.aspx   forumz