如何开发一个简单的扩展（Hello World）

Firefox其开源的性质得到了广大爱好者的大力支持。现在的Firefox扩展可谓是应有尽有精彩纷呈，我们每天都在用着扩展，然而我们一些人可能不知道扩展是怎样做成的。怀着探索的精神以及求知的欲望，我相信很多人都很想知道扩展是怎样做成的，并且都希望自己也能动手来做一个扩展，无论界面多么丑陋，也无论功能多么简单，只要是自己动手做出来的，总能收获一种充实，感到一份喜悦。然而俗话说万事开头难，只有首先冲破入门的束缚，之后方能走进开发和研究征途。

可不可以从一个简单的扩展出发，就实现一个hello world扩展。
扩展名：
helloworld
功能如下：
在工具菜单中添加一个“hello world"的选项，鼠标点击之后弹出一个窗口，里面显示一张图片，图片的下面显示文字“hello world"。

就这么简单，但是对于从来没有开发经验的人来讲，实现起来也许并不简单。
我在网上找到很多开发扩展的资料，看起来觉得不难，可实现起来总会有一些莫名的错误发生。

Firefox的发展也正需要不断地补充新鲜的血液方能更加威武，希望有开发扩展经验的朋友们能够畅所欲言，知而无不言，让我们大家一起分享创作过程的那种彭湃激情。

强烈支持楼主，我也准备学习写扩展了，呵呵
很期待楼主的教程哦~

扩展几个月前就已经写出来，也准备了很多文档，力求简单并且清晰地把整个过程详细描述出来，包括扩展的整体结构，语言包，安装，xul的应用，js的交互，css的调用，以及一些学习资源。拖了这么久还没有搞出来，首先是因为力求把文档写得尽量对很多人有价值，二是因为公司的项目比较紧急，整天加班到凌晨两点。。。新年又要到了，新年回来后一定会奉上。感谢各位大牛之前的指点，其实很多大牛只是没有时间，要不然让他们来撰写这样的文章，会更好一些。大牛们都是天心之皓月，相比之下我只是萤火之光而已。。。

lz真不错，现在这样的人只怕不多了。

LZ，大大地支持你～！

厉害啊，坚持就是胜利

时间过得很快，去年8月22日发的贴子，现在又已经是8月了。可能自己是一个不把事情完成就不死心的人，这一年来从事了网站开发，苦练了asp.net C# php mssql ajax html css js jquery mysql sqlite，最近工作很忙，仍然挤出些时间参阅大量的文档，把开发一个简单的扩展的事搞定，今年8月22日将会把如何开发一个扩展的详细过程补上以延续那曾经的亢奋和激情！！！

hello world的基本功能现在定义在可以在工具菜单或者在右键菜单中打开对话框，输入你的名字，或者你爱人的名字，点保存后显示在状态栏中，没有lover的可以雕刻自己的名字在状态栏上，表示对自己的重视；有lover的可以将爱人的名字雕刻在状态栏上，以表达对爱人的无比思念之情。。。祝天下有情人终成眷属。。。

永远支持火狐！

另外，之前就已经和你说了，在 setting.xul 中，给 <radiogroup> 加一个 id，比如：
<radiogroup id='color'>
那么 document.getElementById("color").selectedItem.id 就是用户选择的颜色。你现在有5个颜色，你的OnSave中就用了5个判断，如果有100个颜色，难道要写100个判断语句？对话框初始化也一样，假设上次选择的颜色保存在变量Color中，那么用 document.getElementById("color").selectedItem = document.getElementById(Color); 一条语句就行了。

下载了你的文件，在 #my-panel 和 [mode="blue"] 之间多了一个空格，其它的也是一样。

在setting.xul弹出的对话框中，单选black，red，blue，green任一个后点击确定，也就是调用setting.js的onSave()，然后onSave()函数要怎样实现，才能改变overlay.xul中状态栏中my-panel的字体按照CSS文件中#my-panel的属性mode的值来显示。。。


各位前辈再赐教一下，不胜感激~~

附件如下：

这是我的chrome.manifest文件（在最后一行有添加哟——！）

content helloworld chrome/helloworld/content/
locale helloworld en-US chrome/helloworld/locale/en-US/
locale  helloworld  zh-CN   chrome/helloworld/locale/zh-CN/
skin helloworld classic/1.0 chrome/helloworld/skin/

overlay chrome://browser/content/browser.xul chrome://helloworld/content/overlay.xul
style chrome://global/content/customizeToolbar.xul chrome://helloworld/skin/overlay.css

大侠，我是不是添加得不对？？？

扩展的 chrome.manifest 文件中，没有添加 style 吧，扩展没有套用 overlay.css

MyPanel.style.color = Color;改成MyPanel.setAttribute("mode", Color);还是不行

之前用window.opener.document.getElementById('my-panel').setAttribute("style", "color:green");可以改变颜色,但这是一种不好的编码方式。

但是现在用window.opener.document.getElementById('my-panel').setAttribute("mode", "green")也不行，好生奇怪，不知道哪里错了。。。。

MyPanel.style.color = Color;
改成
MyPanel.setAttribute("mode", Color);
就可以了。

开始搞插件开发讨论了？