FireFox 插件

faunus

LIST

占位

faunus

Chrome List - 揭开Firefox扩展们的神秘面纱Firefox本身的功能都是怎样实现的？那些Firefox扩展又都是怎样实现的？使用了哪些技术？脚本是怎么写的？我可以修改么？怎么来修改？如果你和我一样好奇，想要探究这些问题的答案，那么Chrome List这个Firefox扩展可以帮助你解答。

【扩展名称】Chrome List
【扩展作者】Gijs Kruitbosch
【下载地址】https://addons.mozilla.org/firefox/addon/4453



ChromeList是一款Firefox扩展，通过一个列表显示出Firefox中注册的所有程序包，并可以显示每个包中的内容，包括脚本、XUL、本地化信息等。本文介绍的版本是0.2.2，2007年10月11日发布，兼容于Firefox 2.0 - 3.1b1pre。

什么是Chrome，千万别和我说你只知道Google的Chrome浏览器，这里的Chrome指的是Mozilla的一种协议，可以把扩展等使用的资源文件通过Chrome URL映射到物理文件上，如果你看过扩展的源代码，就应该知道扩展的所有本地资源都是使用Chrome协议开头的。

在每个扩展中，都有一个chrome.manifest文件，在这个文件中通过content、skin和locale等命令把本地资源都映射到了相应的chrome地址上，在Chrome List这个扩展中显示的就是经过映射的这些资源。

在工具菜单调用“Explore Chrome”，就可以打开“ChromeBrowser”窗口，左面是一个树型控件，第一级显示的就是映射名称，通常每个Firefox扩展会使用一个统一的名字。第二级是映射的类型，通常有content、skin和locale三种。在往下浏览，就可以按照目录结构一级一级查看文件结构，直接双击就可以直接在新窗口中查看源代码，也可以选择在新Tab中打开，比如把XUL文件在新Tab中打开，相当于执行这部分功能了，和调用扩展相应的窗口是一致的。

具体怎么看懂源代码就不是这个扩展的功能，也不是本文的讨论范围了，需要大家再补充相应知识后一点点研究了。Chrome List这个扩展对于吸取他人的经验是一个非常好的途径。作为扩展开发者是一个必装的扩展。而对于其他好奇者，只要略懂开发，装一下也无妨咯，呵呵。

faunus

http://kb.mozillazine.org/Extension_development

The Extension Wizard generates an extension skeleton to meet yourneeds. It is intended to save the time you would normally spend copyingand pasting from your previous extensions or sample extensions.

faunus

AMO就是　ｍｏｚｉｌｌａ官方扩展下载站点　addons.mozilla.org　的缩写
AMO 3.2 是最新的版本！

faunus

ChinaStock          本地安装         AMO安装               
在状态栏显示您指定的股票当前最新价格信息，通过右键菜单可以设定股票代码并查看详细的股票信息。        

• 安装之后将在浏览器状态栏右边部分增加一块区域用于显示股票信息。
• 鼠标移至状态栏对应区域将显示当前股票概况及分时图；
• 单击鼠标左键进行显示状态切换；
• 双击鼠标左键打开当前股票详细信息窗口；
• 单击鼠标右键显示功能菜单，可以选择进行上述两个操作或通过“选项”设置自己关心的股票及信息更新频率、滚动频率等参数。并可以对是否显示各种综合指数、是否显示升降箭头&名称&浮动百分比等进行个性化设置。

感谢 rick, 蛋蛋, Michael, offscourings 等朋友的宝贵意见及Bug报告！

faunus

http://ted.mielczarek.org/code/m ... ev/extensiondev.xpi

注：在3.*.*下的安装，会出现
"Extension Developer" 将不会被安装，因为它未提供安全更新

解决方案如下：
1. 将extensiondev.xpi改为extensiondev.zip。
2. 将install.rdf解压缩到任意位置， 使用文本编辑器（记事本、UltraEdit等）打开install.rdf文件 ， 找到包含如下内容的一行
<em:updateURL>http://ted.mielczarek.org/code/mozilla/extensiondev/extensiondev.rdf<;/em:updateURL> ，
将其删除后保存。
3. 将修改后的install.rdf文件，重新添加到extensiondev.zip。
4. 关闭WinRAR，将Thunder.zip改名回extensiondev.xpi。

[ 本帖最后由 faunus 于 2008-12-4 09:58 编辑 ]

faunus

http://www.mozilla.org/projects/venkman/
http://www.hacksrus.com/~ginda/venkman/

!!右下角的控制台console里输入"/restore-layout factory"，
可以恢复界面初始设置

另一个教程
http://www.css88.com/article.asp?id=448

Firefox下的Venkman调试器（1）
摘要：《JavaScript完全自学宝典》第1章JavaScript初体验，这一章将介绍JavaScript的基本概念、基本特征、应用技术基础（与HTML文件的融合、错误调试、浏览器支持）以及简单的JavaScript应用的实例。本小节为大家介绍的是Firefox下的Venkman调试器。

Firefox有自己的JavaScript脚本调试器Venkman，目前Venkman的版本是0.9.87。
1．Venkman的安装
Venkman是Firefox的插件，使用前需要下载安装，而且需要在Firefox环境下安装。登录Venkman官方网站：http://www.mozilla.org/projects/venkman/，单击如图1.39所示的Download latest Venkman Javascript Debugger extension forFirefox超链接，跳转到下载安装页面。单击如图1.40所示的InstallNow按钮，Firefox中会弹出"软件安装"对话框，要求用户确认安装，如图1.41所示。用户确认后，系统自动安装Venkman。安装完成后，重启Firefox，Venkman就能正常使用了。至此，Venkman安装完成。

（点击查看大图）图1.39  Venkman下载链接

图1.40  Venkman安装链接

图1.41  Firefox"软件安装"对话框

在Firefox 1.5和Firefox2.0下Venkman会有缺陷：打开Venkman，关闭之后，无法再次打开。按照官方网站的解决办法--重启Firefox，问题才能解决（不同版本的Firefox，可能会有不同的效果，本书使用的Firefox版本是2.0.8）。
2．在Firefox中启动Venkman
在Firefox中选择"工具"→"JavaScript Debugger"命令，即可打开Venkman，如图1.42所示。

（点击查看大图）图1.42  在Firefox中打开Venkman

Venkman运行界面如图1.43所示，除了基本的菜单栏、工具栏、状态栏外，还有打开文件列表、本地变量列表、断点列表、当前文件名、源代码窗口、信息输出窗口和命令输入框等。
3．使用Venkman调试JavaScript
（1）测试Venkman是否正常运行
用Firefox打开需要调试的文件，启动Venkman，在命令输入框中输入"1+1"，测试Venkman是否正常运行，效果如图1.44所示。

（点击查看大图）图1.43  Venkman运行界面

（点击查看大图）图1.44  测试调试器是否正常运行

[ 本帖最后由 faunus 于 2008-12-8 12:25 编辑 ]

faunus

（2）设置当前调试对象
在文件列表中显示打开的文件。双击文件名，右侧的源代码区域会显示该文件的源代码。在Venkman中，需要用户指定被调试的文档为当前调试对象。首先，将打开的文件列表窗口切换至Open Windows，然后右击需要调试的文件，最后在弹出的快捷菜单中选择Set as EvaluationObject命令，即可设定需要调试的对象。指定方法如图1.45和图1.46所示。
（3）Venkman中使用命令输入框调用函数
指定调试对象后，直接在命令输入框中输入JavaScript函数名就能调用函数，Venkman即可直接操作JavaScript中的内容进行调试。例如，打开代码1.1，对代码1.1中的JavaScript进行调试。完成以上步骤以后，在命令输入框中输入函数名"hello()"，按Enter键，Venkman将控制返回到Firefox界面，直接调用hello()方法，执行与单击Hello按钮相同的操作。
用户还可以直接在命令输入框中输入JavaScript代码。例如，在命令输入框中输入"document.getElementById("hello")"，输出窗口中显示JavaScript代码的返回值[objectHTMLInputElement]。如果没有得到对象，会显示null，效果如图1.47所示。

图1.45  打开Open Windows

图1.46  设置调试对象

图1.47  JavaScript执行效果

如果之前没有设定调试对象，在命令输入框中直接输入函数名，Venkman会在输出窗口中提示"ReferenceError: hello isnot defined @ <x-jsd:interactive-session> 2"的错误信息，如图1.48中红色区域所示。

（点击查看大图）图1.48  Venkman未设定调试对象的提示信息

（4）Venkman中设置断点调试JavaScript
在Venkman中断点有两种类型：future断点和硬断点，如图1.43所示。JavaScript函数体以外的部分只能添加future断点。在JavaScript函数体中，单击某行，添加的是硬断点；再次单击，添加的是future断点。future断点用于控制JavaScript函数体外的代码调试。future断点、硬断点与其他调试环境中的断点作用基本是一样的，当程序运行至断点处时挂起，暂停程序的执行。future断点与硬断点的区别在于：硬断点只有当用户执行函数体对应的操作时才执行；future断点在页面加载后立即执行。大部分情况下，用户使用的是硬断点。
在Venkman中，有个Breakpoints（断点）列表窗口。该窗口中显示的是当前文件中的断点列表（如图1.43所示），用户可以清晰地看到目前文件中的断点数量、断点类型（future断点、硬断点）、断点在文件中的行数等信息。当在Venkman中打开源文件时，工具栏上用于调试的Continue（继续）、Step Over（跨过函数调用）、Step Into（进入函数调用）和StepOut（跳出函数调用）按钮都不可用，如图1.49所示，说明此时还无法进行调试。此时，只有Stop按钮可以使用。

图1.49  打开源文件时的调试工具栏

faunus

用户单击Stop按钮，Venkman会停止（暂停）当前执行的脚本。如果当前没有执行任何脚本，Venkman会转到"等待事件发生"的状态。在设置了断点之后，单击Stop按钮，Venkman会打开一个空的venkman.xul文件，而且Local Variables（本地变量）列表窗口中会显示JavaScript内置的以及用户定义的变量，同时Continue按钮变为可用，而Stop按钮变为不可用，如图1.50所示。

（点击查看大图）图1.50  单击Stop按钮效果
单击Continue按钮，Venkman会恢复单击Stop按钮之前的状态。此时，再次单击Stop按钮，会发现Stop按钮图标改变，在图标中添加了3个白色小点（ ），此时回到Firefox浏览器中，单击"刷新"按钮，系统将自动切换至Venkman中，并且将光标停留在JavaScript函数体的第一行，效果如图1.51所示。

（点击查看大图）图1.51  刷新Firefox后的现实效果
在命令输入框中输入函数名"validate()"，程序在第一个断点处挂起，效果如图1.52所示。

（点击查看大图）图1.52  程序在断点处挂起效果

用户可以看到：输出窗口中，高亮显示断点行的全部代码。源代码窗口中，高亮显示断点行，并且将光标停在断点行。代码调试工具Continue、 Step Over、Step Into、Step Out按钮可用。单击Step Into按钮，程序继续执行，到下一处断点挂起。用户再次单击Step Into按钮，程序再继续执行，重复操作，直到程序结束或用户中断。

如果调试过程中存在与浏览器的交互，Venkman会自动将界面切换至Firefox中，执行完毕返回Venkman。如果用户不想进入当前断点之后的函数调用调试，可以单击Step Over按钮，跳过这个函数调用。但是Step Over并不代表函数不再执行，而是用户不再进入调用函数的调试。Step Out代表不再执行函数。用户单击Step Out按钮，将不调试函数调用，直接跳过函数调用，不再执行调用的函数。

Venkman是JavaScript代码调试器，不是编辑器，因此不能在Venkman中编辑代码。使用Venkman配合UltraEdit，既可以编辑源文件，又可以调试文件脚本，可以根据调试结果随时更改源文件。

faunus

1.6  JavaScript和浏览器
前文介绍到，每种JavaScript解释器的运行效果不尽相同。不同的浏览器，运行JavaScript时会有不完全相同的效果。不同的浏览器在调用JavaScript时也会有所差别。下面将分别介绍在InternetExplorer中调用JavaScript代码、在Firefox中调用JavaScript代码、在Opera中调用JavaScript代码以及浏览器中的文档对象模型（DOM）。
1.6.1  在Internet Explorer中调用JavaScript代码
InternetExplorer是微软开发的Web浏览器，内置在微软Windows操作系统中，目前最新版本是7.0。到目前为止，InternetExplorer只支持微软的Windows操作系统（2003年微软宣布停止针对Mac的InternetExplorer的开发）。由于Windows操作系统的流行，InternetExplorer成为目前较为流行的Web浏览器之一。但是，InternetExplorer内部采用了许多微软的专利技术，例如ActiveX等技术，这些技术的应用提高了JavaScript的使用范围（用户甚至可以使用ActiveX控件操作本地文件），但是降低了安全性，而且这些技术有很多不符合W3C规范，使得在InternetExplorer下开发的页面在其他Web浏览器下无法正常显示甚至无法使用。
例如，在Internet Explorer中，得到页面中id为txtId、name为txtName、type为text的对象。页面中定义text对象的代码如下：

<input type="text" id="txtId" name="txtName" value="">

在Internet Explorer下使用JavaScript得到这个text对象的代码如下：

var _txtNameObj1 = document.forms[0].elements("txtName"); var _txtNameObj2 = document.getElementById("txtId"); var _txtNameObj3 = document.frmTxt.elements("txtName"); var _txtNameObj4 = document.all.txtName;

在Internet Explorer下使用JavaScript获得某个对象的方法如下：
document.forms[0].elements("对象名")。
document.Form名.elements("对象名")。
document.getElementById("对象ID")。
document.all.对象名。