firefox 插件很多，网上的推介列表也多如牛毛，我也用过很多。最后留在我的

portable firefox 的插件大约就是下面这些：

ColorfulTabs 每个tab 显示不同颜色

ColorZilla 页面取色

access Flickr 支持访问 flickr 的工具

compact menu 关掉 ff 菜单，以一个按钮取而代之，节约一行显示空间

flashgot 下载管理器

gladder 你身在中国对吧？那你难道不需要这个？gladder “梯子”，显然…

gmail notifier 提醒 gmail 邮件

ie tab 对付那些只支持 ie 的破网站

live pagerank 显示该站点 pagerank

stumbleupon 和 del.icio.us 一样的好东西，你总不想大海捞针地找好玩的东西吧

viwe source chart 查看处理过的源代码

firebug 帮忙找到 java script 的错误所在

torbutton 打开 tor（linux下ff插件。如果是 windows 我直接用 Democrakey）

知道名字后，自己在 firefox 插件官方站点 搜索即可。

前两天在 百度知道 突然见到类似

</p> <p><a href="http://%62%6c%6f%67.%67%75%6f%73%68%75%61%6e%67.%63%6f%6d/">guoshuang blog</a></p> <p> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

这样的写法（上面这个其实就是 http://blog.guoshuang.com）。让人家看不到真实的地址，点过去一看原来只是个骗取点击的站点。：（

javascript 的 escape 只能转中文和一些符号，不转换英文。写了个简单的转换程序。

</p> <input id="urlWantToBeEscaped" id="escapedURL" value="http://" size="60" /> <button onclick=" transURL(document.getElementById('urlWantToBeEscaped').value)">把地址转为 unicode </button></p> <p><script></p> <p>var oArray = ["%61","%62","%63","%64","%65","%66","%67","%68","%69","%6a","%6b","%6c","%6d","%6e","%6f","%70","%71","%72","%73","%74","%75","%76","%77","%78","%79","%7a","%3A"];</p> <p>var oLetter = “abcdefghijklmnopqrstuvwxyz:”;</p> <p>function transURL(str){</p> <p> transStr = “”;</p> <p> if(str.indexOf(”http://”) == 0){</p> <p> str = str.substring(7,str.length)</p> <p> //alert(str)</p> <p> for(i=0;i<str.length;i++){</p> <p> if(oLetter.indexOf(str.charAt(i)) != -1){transStr += oArray[oLetter.indexOf(str.charAt(i))]}</p> <p> else{transStr += str.charAt(i)}</p> <p> }</p> <p> document.getElementById("finalURL").value = "http://"+transStr;</p> <p> document.getElementById("urlTest").href = "http://"+transStr;</p> <p> }else{</p> <p> alert("必须是 http:// 开头的地址");</p> <p> }</p> <p>}</p> <p></script></p> <input id="finalURL" size="60" /> <p><a id="urlTest" href="#1">这里是链接测试</a></p> <p> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

这个 Get the rendered style of an element 是2006年4月的24发的，但我今天才看到。

为了拿到元素的当前样式

ie 用 currentStyle 和 runtimeStyle

ff 用 getComputedStyle

opera 似乎是直接 style 和 getComputedStyle 都可以（记不清楚了，谅解）

以前都是自己写，再说公司的破项目仍然都在 ie 6 下跑，因此倒还没感到痛苦。

函数定义

</p> <p>function getStyle(oElm, strCssRule){</p> <p> var strValue = “”;</p> <p> if(document.defaultView && document.defaultView.getComputedStyle){</p> <p> strValue = document.defaultView.getComputedStyle(oElm, “”).getPropertyValue(strCssRule);</p> <p> }</p> <p> else if(oElm.currentStyle){</p> <p> strCssRule = strCssRule.replace(/-(w)/g, function (strMatch, p1){</p> <p> return p1.toUpperCase();</p> <p> });</p> <p> strValue = oElm.currentStyle[strCssRule];</p> <p> }</p> <p> return strValue;</p> <p>}</p> <p>

调用

</p> <p>getStyle(document.getElementById(”container”), “font-size”);</p> <p>

唯一缺点在于 ie 5，需要加 try catch

下载 getStyle.js

以前的方法有 SWFObject 和 UFO，flashReplace 的作者 Robert Nyman 对它们展开了如下的批判：

* I didn’t find the code that easy to read, and tweak, if wanted.

flashReplace的代码易读易改

* The file size. SWFObject is about 6.7 KB and UFO is about 10.7 KB. I’m a sucker for small file sizes, so therefore FlashReplace is only 2.1 KB.

swfobject 6.7K，而 UFO 要 10.7 K，flashReplace 只有 2.1K

* Neither of them created standards-compliant code; FlashReplace does. Not anymore. Now it creates an additional embed element for maximum compatibility

以上二者生成的都不是标准代码，flashReplace 加上了 embed（郭爽注：加上embed 同意，standards-compliant code 不同意，网页验证不会去读 js 产生的 html）

* Several lines are needed to insert a Flash Movie. FlashReplace only needs one line.

FlashReplace 只需要一行代码。

郭爽注：在这之前我只用过 swfobject 感觉很方便。

代码示例，猜都能猜出来，因此不做解释。

</p> <p><script type="text/javascript"></p> <p> FlashReplace.replace("flash-content", "/flash/my-movie.swf", "flash-element-id", 800, 200);</p> <p> FlashReplace.replace("da-cool-header", "/flash/cool-header.swf", "flash-element-id", 600, 350, 7, {wmode : "transparent"});</p> <p> FlashReplace.replace("sidebar", "/flash/sidebar.swf", "flash-element-id", 200, 700, 7,</p> <p> {</p> <p> wmode : "transparent",</p> <p> quality: "high",</p> <p> bgcolor: "#ffffff"</p> <p> }</p> <p> );</p> <p></script></p> <p>

下载 flashReplace js 代码

原文来自 replaceHTML for when innerHTML dogs you down

这个叫 ven Levithan 的家伙做了测试发现：innnerHTML 在清除（清空已有的 html 代码）的时候花费的时间最多，于是写了个创建+替换的方法，这样速度快，尤其是页面元素很多的情况下。

</p> <p>/* This is much faster than using (el.innerHTML = str) when there are many</p> <p>existing descendants, because in some browsers, innerHTML spends much longer</p> <p>removing existing elements than it does creating new ones. */</p> <p>function replaceHtml(el, html) {</p> <p> var oldEl = (typeof el === “string” ? document.getElementById(el) : el);</p> <p> var newEl = document.createElement(oldEl.nodeName);</p> <p> // Preserve the element’s id and class (other properties are lost)</p> <p> newEl.id = oldEl.id;</p> <p> newEl.className = oldEl.className;</p> <p> // Replace the old with the new</p> <p> newEl.innerHTML = html;</p> <p> oldEl.parentNode.replaceChild(newEl, oldEl);</p> <p> /* Since we just removed the old element from the DOM, return a reference</p> <p> to the new element, which can be used to restore variable references. */</p> <p> return newEl;</p> <p>};</p> <p>

意义不是特别大，但钻研精神值得敬佩。根据留言看来，似乎 firefox 在这个问题上（destroy html）的效率最低。IE 用 replaceHTML 处理15000 个元素的时候，性能反而有所下降。

FF2

15000 elements…

innerHTML (destroy only): 26687ms

innerHTML (create only): 656ms

innerHTML (destroy & create): 27969ms

replaceHtml (destroy only): 110ms (242.6x faster)

replaceHtml (create only): 594ms (1.1x faster)

replaceHtml (destroy & create): 703ms (39.8x faster)

Done.

IE7

15000 elements…

innerHTML (destroy only): 94ms

innerHTML (create only): 391ms

innerHTML (destroy & create): 406ms

replaceHtml (destroy only): 78ms (1.2x faster)

replaceHtml (create only): 359ms (1.1x faster)

replaceHtml (destroy & create): 422ms (1.0x slower)

Opera 9

15000 elements…

innerHTML (destroy only): 47ms

innerHTML (create only): 250ms

innerHTML (destroy & create): 578ms

replaceHtml (destroy only): 94ms (2.0x slower)

replaceHtml (create only): 219ms (1.1x faster)

replaceHtml (destroy & create): 328ms (1.8x faster)

Done.

测试页面在这里

原文 JavaScript Programming Patterns 将 js 变成大致分为下面几种模式：

The Old-School Way

Singleton

Module Pattern

Revealing Module Pattern

Custom Objects

Lazy Function Definition

除了1、2两种，懵懵懂懂看不出奥妙何在，不做笔记，回头再看。