《火狐扩展FiForm开发手记.docVIP

火狐扩展FillForm开发手记FillForm是Firefox的一个扩展，根据名字可以看出来是填写表单，但是实际基本所有的表单元素都会处理的，这个扩展的功能就是可以保存和填写当前网页所有文本框、复选框、单选框的内容(input、textarea、select标签)。 火狐官方安装地址：/zh-CN/firefox/addon/160849 虽然Firefox本身也有自动填表的功能，但是也有些缺陷，例如：1.别人临时用下你的电脑登录下邮箱，可是一打开网址发现里面已经填了你的用户名和密码，这是我们所不愿意的。2.有些网页在打开后会初始化一些东西，例如清空所有文本框，这样Firefox刚刚自动填入的内容也没了。典型的一个例子就是163邮箱登录。3.Firefox要保存文本框内容必须在你有提交表单动作的时候才提示“记住”还是“跳过”。4.有些文本框并没有放在Form表单中，这样Firefox是没法直接保存的。 网上有一些填写表单的扩展的，但是用起来很不方便，记得有个扩展是把Firefox本身的填表功能升级了，填写用户名和密码后自动提交，这样上面列 出的问题1对我们来说就更加糟糕了。还有个扩展是必须要用户自己设置哪个id哪个name的标签设置为什么值，这个对于大多数根本就不懂HTML基础知识 的人来说应该比较困惑，即使懂HTML的人也觉得比较麻烦。 用过世界之窗浏览器的人就知道了，那个里面的自动表单功能很好用，Alt+1就保持当前表单内容，Alt+Q就填写当前表单内容（前提是你已经保存 了数据），在你需要的时候才填写。本扩展就是要在Firefox上实现这功能。网上制作Firefox扩展的范例很少，在这里就顺便和大家分享下，记录下 我的开发过程，大家也可以在下面发表点的建议。 2010/4/3 关于如何写火狐扩展，网上中文资料真是少之又少，好不容易找到个范例，对照着做还是没反应。最后绕到火狐官网的开发者中心，都是英文的，尽管看着比 较吃力，但是还是慢慢啃了，找到个helloworld的范例，安装很简单，直接把xpi文件拖到火狐浏览器里面即可。xpi文件其实就是个zip压缩文 件，把后缀名改成zip然后解压就可以看到里面的结构和代码了。组成比较简单，基本就一个js和一个xul文件。它是在浏览器中的工具菜单下增加一项，点 击后会弹出一个关于对话框。 现在要做的就是在那个js文件里使用dom方式访问当前网页了，读取设置值。可是当前页面的顶级元素是什么呢？在js中是document，我在那 范例代码里的js里修改测试了下发现并不被认识，然后研究了下其它的扩展的代码（所有本机安装了的扩展都可以看到代码的），尝试了doc、 application、firefox、app等，都不行。 继续找资料，发现原来火狐浏览器自己的整个界面也是个xul文件，可以通过chrome://browser/content /browser.xul访问，document是顶级元素，可是不是那个当前网页的顶级元素，这样直接用document访问显然就不行了。检查了下当 前网页所在的元素是： view plaincopy to clipboardprint? tabbrowser?id=content?disablehistory=true?flex=1?contenttooltip=aHTMLTooltip?contentcontextmenu=contentAreaContextMenu?onnewtab=BrowserOpenTab();?autocompletepopup=PopupAutoComplete?ondrop=contentAreaDNDObserver.onDrop(event)?onclick=return?contentAreaClick(event,?false);panel?class=autoscroller?id=autoscroller/panel/tabbrowser?? ????? 这样用document.getElementById(content)访问，但是真正要访问当前打开的页还不行，得用 document.getElementById(content).selectedBrowser.contentDocument，这样就突破 了一大难关，和网页交互基本不是问题了。我写了下面这段代码读取Input标签的id、name、index（测试成功）： view plaincopy to clipboardprint? var?currentDocument?=?document.getElementById(content).selectedBrowser.contentDocument;?? var?colInputs?=