繠蝶冰緣

CSS hack 初学小结

2009-06-24T09:16:00.001+08:00

什么是浏览器HACK：当我们使用不同的浏览器（Firefox，IE7， IE6， IE 8, Safari, Opera, chrome）访问同一个网站，或者页面的时候，会出现一些不兼容的问题，有的显示出来正常，有的显示出来不正常，我们在编写CSS的时候会很恼火，刚修复了这个浏览器的问题，结果另外一个浏览器却出了新问题。而HACK就是一种办法，能让你在一个CSS里面独立的写支持不同浏览器的样式。这下就和谐了。呵呵！

第一个HACK，IE FF 所有浏览器公用（其实也不算是HACK）

height:100px;

第二个HACK IE6专用

_height:100px;

第三个HACK IE6 IE7公用

*height:100px;

介绍完了这三个HACK了，下面我们再来看看如何在一个样式里分别给一个属性定义IE6 IE7 FF专用的HACK，看下面的代码，顺序不能错哦：

程序代码

height:100px;

*height:120px;

_height:150px;

下面我简单解释一下各浏览器怎样理解这三个属性：

在FF下，第2、3个属性FF不认识，所以它读的是 height:100px;

在IE7下，第三个属性IE7不认识，所以它读第1、2个属性，又因为第二个属性覆盖了第一个属性，所以IE7最终读出的是第2个属性 *height:120px;

在IE6下，三个属性IE6都认识，所以三个属性都可以读取，又因为第三个属性覆盖掉前2个属性，所以IE6最终读取的是第三个属性。

CSS Hack 的内置与外置写法

外置：

.main{ float:left;#float:none;_float:none;

html*.main{ float:left;#float:none;_float:none; }

*+html .main{ float:left;#float:none;_float:none; }

* html .main{ float:left;#float:none;_float:none; }

* 第1行给Firefox以及其他浏览器看

* 第2行给safari/IE6/iE7看，如果safari/IE6/iE7 视觉效果不统一，就要在后面跟IE6/IE7的定义

* 第3行给IE7看

* 第4行给IE6以及更老的版本看

内置：

.main{ float:left;#float:none;_float:none;[float:none;]float:none; }

* 第1个float给Firefox以及其他浏览器看

* 第2个加#的float给IE7看

* 第3个加_的float给IE6以及更老的版本看

* 第4个加[的float给safari看

* 第5个加]的float给IE看

仅 Safari 和 Opera 识别的 Hack

@media all and (min-width: 0px)

{/* Safari and Opera rules here */}

或者

@media screen and (-webkit-min-device-pixel-ratio:0)

{/* Safari and Opera rules here */}

注：这里所指代的 Safari 和 Opera 一般为最新版本。

仅 Firefox 3 和 IE7 识别的 Hack

selector, x:-moz-any-link, x:default

{/* Firefox 3 and IE7 rules here */}

使用方法例：

在

@media screen and (-webkit-min-device-pixel-ratio:0)

{

.box{width:100px;}

/* Safari and Opera rules here */

}

firefox, IE, safari, chrome, opare用之初体验

2009-06-23T17:38:00.002+08:00

干这行的，不装3个以上浏览器未免显太不够专业了，于是今天安装了safari

。本人一共装了firefox, IE8(可当IE7)，Opera， Safari and chrome五款

主流浏览器。每次写页面的时候都要在不用的浏览器上进行测试，修改。最

终使其在每一种浏览器下的style保持一致。可惜只安装了个XP，不能体验其

他系统下的其他浏览器中style 的差异，未免有些遗憾。

才安装好safari的时候，发现好像chrome啊。。。

用下来还是喜欢firefox,毕竟firebug用下来比较hi，但发现FF一旦访问某些网页时就会泄漏，只有马上看完，关了，很是不爽。

源码的修改，定位和查看：除了FF， IE8可以定位查看并进行修改html和css代码，然后实时显示，其他的暂时没发现，用起来不爽，一看就是一堆源码，必须花时间从一堆源码中找到到你要看的部分。其中在Firebug中修改是即时显示的，不用回车，而且显示出来padding和margin的大小，但IE8 只是显示个难看的定位框框，修改时候还要按回车，然后等待浏览器缓慢的反应。。。

javaScript：

众多浏览器现在都支持了javaScript的调试，但是一开始用的是IE 8，发现很爽，后面改用firebug，更是爽，其他的没用过。不过无非都是差不多的，只是感觉firebug更加速度和人性化，界面也很好看。

CSS半透明度设置,兼容Firefox, IE, Chrome, Opera and Safari

2009-06-23T14:44:00.001+08:00

IE： filter:alpha(opacity=sqlN) 其中 sqlN的值域为[0, 100]

Firefox： -moz-opacity:sqlN 其中sqlN的值域为[0, 1]

Chrome, Opera and Safari：opacity:sqlN 其中sqlN的值域为[0, 1]

简述JSF测试框架

2009-06-23T14:05:00.000+08:00

http://developer.51cto.com 2009-06-22 15:52 网络中国IT实验室

摘要：本文介绍JSF测试框架，包括介绍JSF测试框架需要具备的特性和测试框架的分类等。

因为在容器以外测试JSF组件有所限制，所以大家一直认为对于JSF应用进行单元测试是困难的。多数web层的测试框架遵循黑盒测试方式，开发者用web组件编写测试类来验证渲染的HTML输出是否符合预期。 HtmlUnit，HttpUnit，Canoo WebTest和Selenium等框架都属于这个类型。这些框架的局限在于它们仅仅只能测试web应用的客户端。

但是这种现象已经随着近来发布的JSFUnit和其它一些JSF测试框架，如Shale Test和JSF Extensions而改变了。这些测试框架支持对web应用的客户端和服务器端组件的白盒测试。并且，一些项目，如Eclipse Web Tools Platform (WTP)和 JXInsight 已开始协助JSF应用的开发和测试了。

与其它的单元测试框架一样，一个典型的JSF测试框架需要具备以下特性：
◆可在容器之外独立的运行一个测试用例，可从一个类似Eclipse 或NetBeans的IDE里面运行测试用例，以促进测试驱动开发（TDD）。
◆可测试完整的HTTP请求－响应生命周期。
◆与构建工具如Ant或Maven集成，从而在一个自动构建和持续集成的环境下运行单元测试。

测试框架还需支持JSF的特定需求，如：
◆在测试方法中调用JSF API，而不是检查HTML输出或客户端DOM对象。
◆通过验证用户在表单上的输入和访问正确的页面视图来导航测试。
◆验证action是否按预期执行，以及错误情况是否显示预期的错误消息。
◆即使rendered属性被设置为假（组件不在web浏览器上渲染但仍在服务器端保存状态）时依然可以验证JSF组件。
◆验证XML配置文件(faces-config.xml 等)是否被正确加载。

JSF测试框架

JSFUnit构建在HttpUnit和Apache Cactus之上，允许JSF应用和JSF AJAX组件的综合测试和调试。它可以在同一个测试类里测试JSF产品的客户端和服务器端。有了JSFUnit API，测试类方法可以提交表单数据，并且验证管理的bean是否被正确更新。

JSFUnit包括一个JSF静态分析测试套件用来验证JSF配置文件，以确保在运行时产生问题之前就能识别出任何与配置相关的问题。它还提供了 JSFTimer组件来执行JSF生命周期的性能分析。它可被应用于跟踪JSF生命周期的每个阶段对于一个指定的web请求的响应时间，并断言该响应时间在SLA限定之内。

JSFUnit支持RichFaces 和Ajax4jsf 组件。此框架的Beta 1版本在上月发布，第二Beta版本计划在下个月末发布。

Shale 测试框架作为一个Apache项目，提供了对Servlet和JSF组件的mock对象实现。这些基础的测试类可应用于测试Shale框架类以及构建于该框架之上的JSF应用组件。Shale测试可用于编写独立的单元测试来运行ViewController 接口暴露的方法。因为为一个ViewController 组件搭建运行环境很复杂，所以Shale测试是很有用的。以下是Shale

测试框架的主要类：

AbstractJsfTestCase：这是对web应用的Servlet和JSF组件进行单元测试的基础测试类
AbstractViewControllerTestCase: 这个类作为AbstractJsfTestCase的扩展，提供了对使用Viewcontroller实现类的常用场景进行测试所需的有效方法。
还有其它JSF web组件的mock实现，叫做为MockApplication，MockExternalContext和MockFacesContext。

Shale测试还与Spring框架进行了集成，允许JSF组件被绑定为管理bean或Spring bean。

JSF Extensions项目是一个无UI组件的集合，它扩展了基于JSF 1.2的web应用的功能。它使用JUnit，HTMLUnit和Cactus进行自动测试。框架的Test-Time模块为JSF 1.2提供mock对象。Design-Time模块具有JSF热部署功能，能停止和重启应用而无需经历构建和重部署周期。这个基于JSF PhaseListener接口的特性会使得所有的配置文件和类被重载。这些使得开发者能在编写JSF应用时遵循一种测试驱动迭代JSF开发方式。

工具

还有一些开发工具也辅助JSF应用的开发和性能检测。JInspired 组的JXInsight提供了JSF跟踪和性能检测特性，该特性基于PhaseListener接口。在JSF应用中使用这个跟踪监听器，开发者和web 管理员可以对于一个JSF请求收集到例如跟踪栈、java调用栈和运行时UIComponent的层次关系等信息。

Eclipse WTP 项目里的JSF工具的子项目还提供了支持开发和部署基于JSF的web应用的工具，如Visual JSF Page Editor和Faces Config Editor。

Jquery Tools——不可错过的Jquery UI库

2009-06-23T14:02:00.000+08:00

发表于: Jquery, 有用的示例 | 作者: IIduce

Jquery Tools是一组基于Jquery构建的用户界面常用组件的集合。通过使用Jquery Tools，网站前端开发无疑会变得更加高效。值得注意的是，Jquery Tools的gzip压缩版本仅有5.8k，如此轻量级而且功能实用的UI组件绝对值得我们关注。下面是官方主页对它的一个描述：

Jquery Tools包含如今网站六个最有用的javascript工具。它的一个优点是所有这些工具可以一起使用、扩展、配置和样式化。
最终，通过它你可以制作出众多不同的网站部件，或用个人的方式创造新的应用。（This library contains six of the most useful JavaScript tools available for today’s website. The beauty of this library is that all of these tools can be used together, extended, configured and styled. In the end, you can have hundreds of different widgets and new personal ways of using the library. ）

下面是Jquery UI包含的工具列表：

选项卡功能(Tabs)
提示工具条功能(ToolTips)
信息滚动功能(Scrollable)
遮罩效果(overlay)
突出效果(expose)
Flash嵌入

有人可能会拿jquery tools和jquery ui去做对比，因为这个，国外还有过不小的争论。感兴趣的可以看看这篇文章：Jquery Tools VS Jquery UI，国内也有人对此发表过言论（blogspot被墙了，可能访问不了），下面是一些引用：

原因就出在於TOOLS官網上寫明了它就是要補jQuery UI不足之處，例如：TOOLS有UI缺乏的tooltips、tabs、overlays等功能，且強調檔案比UI還要小。
marcgrabanski認為TOOLS既然對於UI不足之處有意見，最初就應該加入該UI團隊，一起協同開發改造出新版本，畢竟當初是受到UI的啟發，到後來卻因UI不足之處，甚至另起爐灶創立一個新品牌，這樣的行徑並不厚道。
但支持TOOLS的人卻也有不同的聲音，認為網頁開發者本來就是會殷切期望會有更小、更有效率的plugin，UI長久來效能不是最好，不過大家也都無從選擇起，如今又有新的plugin出現，大家樂見其成，應該給予鼓勵。

Jquery Tools在以下浏览器中测试通过：

由于Jquery Tools相关使用要写的东西比较多，所以本博决定分成几篇来写，本篇主要是给大家一个基本的介绍。从下一篇开始依次介绍Jquery Tools中各工具的使用及示例。心急的朋友可以去官方站点的这个页面，上面给出了丰富的示例。

Jquery Tools系列文章导航：

javascript实用技巧--数组.

2009-06-22T16:16:00.000+08:00

数组和字符串类型对象的方法我特容易搞混淆,所以把他列出来，免得每次取查。

1、concat方法
[作用] 将多个数组联合起来，这个方法不会改变现存的数组，它只返回了所结合数组的一份拷贝。
[语法] arrayObj.concat(array1,array2,...)
[实例]

程序代码

2、join方法，
[作用] 将原有数组对象转换成1个字符串，可以用指定分隔符进行串联。
[语法] arrayObj.join(separator)，separator为分隔符，默认为“,”。
[实例]

程序代码

3、pop、shift方法
[作用] pop方法删除和返回数组中最后一个元素，同时，数组的长度发生变化。与之相对的是shift()方法，删除和返回数组第一个元素。
[语法] arrayObj.pop|shift()
[实例]

程序代码

4、push、unshift方法
[作用] 向数组的末尾添加一个或多个元素并且返回新的长度。同时，数组的长度将会被改变，与之相对应的是unshift方法。注意，方法的返回值并不是新的数组，而是新数组的长度。
[语法] arrayObj.push|unshift(ele1,ele2,ele3,...)
[实例]

程序代码

5、reverse方法
[作用] 把数组中的元素排列次序颠倒过来。
[语法] arrayObj.reverse()
[实例]

程序代码

6、slice方法
[作用] 可将现存数组中选种的元素返回。
[语法] arrayObj.slice(startposition,endposition)，第一个参数为必选，第二个为可选，如不写，则默认为从startposition到最后一个元素。注意，包含startposition这个位置的元素，而不包括endposition。
[实例]

程序代码

7、sort方法
[作用] 用来对数组元素进行排序。
[语法] arrayObj.sort(sortRule())。参数可选，代表排序的方法。特别说明，sort排序有几个基本原则，第一，默认按照字母顺序排列；第二，大写字母排在小写字母之前。基与此，对于数字排序，需要自己写排序方法。
[实例]

程序代码

8、splice方法
[作用] 向数组删除并加入新的元素。
[语法] arrayObj.splice(index,number,ele1,ele2...)。index为索引位置，必须为数字，代表从哪个位置插入或者删除元素。number，代表从index位置往后删除的元素个数，如果为“0”则表示在index插入新元素，不删除往后的数组元素。（说得太混了~~~直接看代码实例）
[实例]

程序代码

9、toString方法
[作用] 使用率非常高的方法，直接将数组类型对象转换成字符串类型对象。
[语法] arrayObj.toString()
[实例]

程序代码

注意：新的字符串是原数组连接而成，但是中间有“,”分隔，如想去掉“,”，可以这样写：

程序代码

作者：admin
时间：2008-01-18

初体验Google Chrome 2——优点和失望之处

2009-06-18T14:04:00.000+08:00

关键词：Google | 感谢ydj9931的提供

五月二十一日，Google发布了新版Chrome，声称做了一些实质性的改进，速度也有所提高。我从Chrome v2发布以来就在使用它，总体上还是很喜欢它，但是也有某些方面令人失望。

新特性

这一版的Chrome有一些我们没注意到的新特性--表单自动填充特性，这意味着你在访问某个页面的时候无需每次都输入用户名和密码（要确保整个站点完全载入了--否则你的细节信息不会被记录下来），全屏模式（按F11）对于上网本用户尤其方便，还有一个选项可以让你移除新标签页上的缩略图，这样就没人知道你在工作时磨洋工或者是在看什么...哦...某些不合适的东西。

我很高兴Chrome正在迎头赶上FireFox和IE--它们都有全屏和表单自动填充功能。从新标签页上移除缩略图这一功能很方便，可以在不想让界面显得凌乱和不想让某个网站显示出来的时候使用它。

界面没有改变，这一点在我看来很好，因为我喜欢最小化的方式。如果你在期待某些界面变化，或许你要失望了。

高速但安全吗？

Google Chrome 2运行JavaScript的速度比上一版更快。它甚至采用了内置高速缓存这样的优化技术，它会直接查找调用点来记录上一个方法的结果，这使得Chrome相当高速。

不过，更快的JavaScript体验也有一些缺陷，因为这也意味着更快的恶意软件下载速度。网络安全软件提供商Websense的安全经理Stephan Chenette说，恶意软件作者在90%含有恶意脚本的网页中使用JavaScript。

基于JavaScript的恶意软件运行的更快，JavaScript是drive-by攻击的载体，安全软件提供商ESET的技术教育主管Randy Abrams如是说。

改善的稳定性

Google许诺这一版本会有更好的稳定性。我必须得说在用Chrome打开20个标签页之前，我觉得它的稳定性没什么问题。我在两台电脑上做了这个测试，结果是一样的--大约百分之七十的站点拒绝访问而有些则崩溃掉了。而当你打开如此之多的标签页的时候，界面会过于拥挤使你无法找到你要的标签。而且无法同时刷新所有标签。

还有，很有趣的是，Google Chrome并不总是可以正常访问Google YouTube。

失望之处

别误会我的意思，我很喜欢Chrome。现在它有全屏模式，这对于上网本是很理想的而速度因素使得它很适合性能不那么强大的系统。但是--仍然没有插件？没有广告拦截？老实说，离开了FireFox的某些插件我都没法活，比如Hyperwords和Shareaholic。面对现实吧，没有插件会使得很多人不会选择Chrome。

还有一些我觉得很值得质疑的东西。安装了Chrome，GoogleUpdate.exe就会开始自动运行。这倒没什么。但是你无法关闭它，所以它就会时常连接网络，搜索更新，占用你的内存。始终保持软件为最新版固然很好，但是不允许用户关闭它或者把它设置为手动启动是有点不道德的。

还有一点我完全不喜欢。或许是只有我才有这个问题如果你没有遇到过这个问题，那我很高兴，但是我的两台电脑都是在安装Chrome而不是GoogleUpdate.exe之后硬盘开始狂转。卸载掉Chrome浏览器后狂转消失，再次安装之后又出现。或许是我多疑了，但是感觉好像Chrome在扫描我的硬盘。为什么呢？

总结

虽然很多方面仍然有待改进，但是我喜欢Chrome的快速和严肃的风格。然而，FireFox仍然是我的默认浏览器。这样说吧--喜欢速度的用Chrome，喜欢效率的用FireFox而IE就留给那些喜欢它的人吧。

实例讲解css中的行为：expression和behavior(附DEMO下载)

2009-06-17T11:55:00.001+08:00

时间:2008-07-21 23:27:38 来源:博客园

结构、表现、行为，分离和联系

网页三要素——结构、表现、行为。这个大家都很清楚（如果你对此不是很熟悉，这里可以这样狭义的理解——结构就是HTML，表现就是CSS，行为就是JavaScript）。为了能写出高内聚、低耦合、可以重复使用，符合web标准的网页，将这三层分离开来是必不可少的，所以在HTML结构中直接写“style="……"”的做法是不提倡的。但是分开并不表示“一刀两断”，作为一个网页的三个组成部分，他们之间还必须保持着联系。例如，结构和表现，用css选择符联系着，而结构和行为用事件联系着。那表现和行为用什么联系着呢？其实联系他们之间的纽带就是我们今天要讲的css中的行为。

表现和行为的联系

好像很多的朋友都感觉：CSS和JavaScript之间有什么关系呀？好像没有必要保持什么联系吧？的确，在很多情况下，他们直接很少联系，甚至在有必要联系的情况下，也可以间接的转化为结构和行为之间的联系。而且，随着最新的浏览器对css2甚至 css3的支持不断完善，结构和行为之间的联系也在不断的在弱化。但是，表现和行为之间的联系，在一些特殊处理，特别是在对IE5-IE6的特效兼容性上，却有着非常大的应用。

下面让我们来看个简单的例子——

<ul >

 <li>我是一个列表项，来自http://justinyoung.cnblogs.com/li>

 <li>我是一个列表项，来自http://justinyoung.cnblogs.com/li>

 <li>我是一个列表项，来自http://justinyoung.cnblogs.com/li>

 <li>我是一个列表项，来自http://justinyoung.cnblogs.com/li>

 <li>我是一个列表项，来自http://justinyoung.cnblogs.com/li>

ul>

很简单，就是一个列表而已。现在我们想在这些列表上，实现一个用户体验更好的改变：当鼠标移到每个列表项上，这个列表的背景颜色高亮显示。对，很实用的一个改变而已。如果我没有猜错的话，你第一想到的应该是下面的代码——

<ul >

 <li onmouseover="this.style.backgroundColor='pink'" onmouseout="this.style.backgroundColor='';">我是一个列表项，来自http://justinyoung.cnblogs.com/li>

 <li onmouseover="this.style.backgroundColor='pink'" onmouseout="this.style.backgroundColor='';">我是一个列表项，来自http://justinyoung.cnblogs.com/li>

 <li onmouseover="this.style.backgroundColor='pink'" onmouseout="this.style.backgroundColor='';">我是一个列表项，来自http://justinyoung.cnblogs.com/li>

 <li onmouseover="this.style.backgroundColor='pink'" onmouseout="this.style.backgroundColor='';">我是一个列表项，来自http://justinyoung.cnblogs.com/li>

 <li onmouseover="this.style.backgroundColor='pink'" onmouseout="this.style.backgroundColor='';">我是一个列表项，来自http://justinyoung.cnblogs.com/li>

没有必要感到害羞，这没有什么错，而且完全实现了效果。只是，当boss说：“麻烦把其他页面的所有列表都实现这个效果”的时候，你会比较抓狂而已。毕竟在整个项目的所有页面中找到所有的li标签，并在里面复制上两句代码绝对不是一个令人舒服的工作。

为什么不试试css中的expression。在公用的css样式表文件中，加入下面的样式，即可立刻实现对所有li标签的效果——

 html public "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <meta name="Keywords" content="YES!B/S!,web标准,杨正祎,博客园,实例代码" />

    <meta name="Description" content="这是一个简单YES!B/S!文章示例页面,来自杨正祎的博客,http://justinyoung.cnblogs.com/" />

    <title>YES!B/S!文章示例页面title>

<style type="text/css">

/*** 为了便于演示，故将样式放在前台页面上 ***/

li{

    star : expression(onmouseover=function() {this.style.backgroundColor="pink"}, onmouseout=function(){this.style.backgroundColor="";})

style>

head>

<body>

<ul >

 <li>我是一个列表项，来自http://justinyoung.cnblogs.com/li>

 <li>我是一个列表项，来自http://justinyoung.cnblogs.com/li>

 <li>我是一个列表项，来自http://justinyoung.cnblogs.com/li>

 <li>我是一个列表项，来自http://justinyoung.cnblogs.com/li>

 <li>我是一个列表项，来自http://justinyoung.cnblogs.com/li>

ul>

body>

html>

对，就是一句“star : expression(onmouseover=function() {this.style.backgroundColor="pink"}, onmouseout=function(){this.style.backgroundColor="";})”就实现了刚才的效果，而且没有对前台结构做任何改变。

这就是expression的作用，一个轻量级的关于样式的行为方式的实现。

见鬼！又变了！

上面的效果真的不错，鼠标浮上去背景高亮显示的效果受到了顾客的好评。以至于顾客说：“这个效果真的不错，能不能给所有的表格单元、引用标签、超链接全部加上这种效果。” 为了满足顾客的兽欲，没有办法，咱只能改呀。于是，你对有td 、blockquote和a标签都加上了这玩意。这是你还多了一个心眼，为了防止顾客对li、td、blockquote和a要不同的高亮显示背景，你把他们分开写了。于是样式表中，非常壮观的出现了下面的代码——

li{

star : expression(onmouseover=function() {this.style.backgroundColor="pink"}, onmouseout=function(){this.style.backgroundColor="";})

td{

star : expression(onmouseover=function() {this.style.backgroundColor="pink"}, onmouseout=function(){this.style.backgroundColor="";})

blockquote{

star : expression(onmouseover=function() {this.style.backgroundColor="pink"}, onmouseout=function(){this.style.backgroundColor="";})

a{

star : expression(onmouseover=function() {this.style.backgroundColor="pink"}, onmouseout=function(){this.style.backgroundColor="";})

顾客对你的反应速度赶到很满意，但是可惜的是：这个顾客只是一个小角色，真正需要的并不是他，而是他的上级BOSS点头，项目才可以验收。好在，那个上级顾客没有提什么过分的要求，只是说：“我希望高亮显示的颜色变成绿色，高亮的文字最好能变成红色，而且鼠标的样子要变成手指的样子！”

虽然那个小角色顾客一开始拍着胸脯说：“绝对不会变了，这就是我们的效果”。但是真正出钱的是那个“上级BOSS顾客”。所以，没有办法，我们也只能改了。这时候为了系统的可扩展性和可维护性，我建议你使用behavior行为。因为作为轻量级的expression解决方案已经不是最好的选择了。

CSS中的behavior行为

CSS中的behavior也是表现和行为相联系的纽带。只是behavior相比expression更善于解决一些重量级的任务（例如在IE6中实现对透明PNG的支持，我们将在以后的文章中讲到）。

所以上面的需求，如果用behavior来实现的话，将会非常轻松。

先建一个htc文件，名字虽然命名，这就命名为"changeColor.htc"吧，内容很简单，会JavaScript的都能看懂——

<public:attach event="onmouseover" onevent="befor()" />

<public:attach event="onmouseout" onevent="after()" />

然后在通用的css文件中加入下面的样式，来引入htc文件——

li, td, blockquote,a  { behavior: url("changeColor.htc") }

这样，就将样式和行为完全的分离开来了。以后那该死的顾客再要改变什么，只要在通用css或者htc文件中进行相应的修改即可。

expression和behavior的重要说明

1：只有IE才可以使用

css中的行为,expression和behavior只有IE才有效，FireFox无效，而且IE也只有IE5以上的版本才支持。

2：不推荐使用expression和behavior

在页面渲染的过程中，expression和behavior需要大量的计算，会大量地耗费客户端资源。所以不到迫不得已，请不要使用expression和behavior。

3：expression和behavior的现实意义

上面两点，好像已经判了expression和behavior死刑。其实，并不是，它们依然有着现实意义——就是用另外一种途径解决IE6的兼容性问题（IE5已经基本退出市场，可以不用考虑）。例如：IE7以上的版本、FireFox、Opera、Safari都已经支持透明PNG图片，但是 IE6却不能支持。这是IE6天生的缺陷，但是为了能让IE6也能够兼容我们的设计效果，那么这时候behavior便有了用武之地。

总的来说，expression和behavior在逐渐的没落，但是只要IE6还是浏览器市场上占有一席之地，expression和behavior就依然有着旺盛的生命力。

目标:安全纯净互联网软件升级报38期

2009-06-15T10:53:00.000+08:00

2009-06-13 09:32:13 PCPOP

近日，一款名为“绿坝-花季护航软件”于前些天突然出现在了大家面前，成为了众网友热议的焦点，绿坝-花季护航软件是一款功能强大的少年儿童上网管理软件，能够过滤网上的不良信息，控制上网时间、限制网聊交友等等。相信大家已经从网上了解到了这款上网管理软件即将预装在国内所有新售电脑的消息，一石激起千层浪网，顿时无数网友通过各种渠道纷纷表示自己的看法。两天前小编也带大家全面体验过了绿坝这款软件的所有功能，我们众多的泡泡网友同样讨论激烈，对此看法不一。

其实像绿坝-花季护航软件这类孩子上网监管软件早已存在，安全纯净的互联网环境一直是大家追求的目标，国际知名流行的杀毒软件诺顿和卡巴斯基为用户提供强大地安全保护的同时，也提供了家长控制功能，也许部分家长为了防止自己的孩子沉溺于网络早就使用上了这样功能的软件。只不过此次热议的焦点来源于工信部发布的一条通知，但是根据目前国内四大门户对网友的调查显示，超八成网友表示不愿意使用该软件，关于“绿坝”的热议还将继续，我们可以一起关注。

接下来让我们暂且跳过绿坝，因为本周值得大家关注的优秀软件还有很多，Windows 7的泄露从来没有停止过，本周接连出现了7227与7231版，最新的7231版不仅有截图还有种子，有兴趣的网友可以动手下载了。另外，本周世界知名的安全厂商卡巴斯基发布了最新的卡巴斯基手机安全软件 8.0版，这是自卡巴斯基实验室推出专业的手机安全软件以来，第三次重大的产品升级。卡巴斯基手机安全软件8.0不仅功能强大，而且能兼容多种手机平台，包括Symbian9.1、9.2、9.3和Windows Mobile5.0、6.0、6.1，是一款集多种领先技术于一身的手机安全软件。

与此同时，世界知名苹果公司一年一度的WWDC 2009大会在圣弗朗西斯科举行，会上苹果全新产品一一亮相从桌面操作系统到移动操作系统以及新iPhone，Safari 4正式版等，给大家带来了诸多惊喜。下面将详细为大家介绍。

一、苹果专区

1. Mac OS X 10.6 Snow Leopard九月上市

Mac OS X以简单易用和稳定可靠著称。经过重新设计的Finder功能充分利用了 Snow Leopard 中的新科技，包括 64 位元支持和 Grand Central Dispatch。反应更快捷灵敏。还包括了很多新功能如定制Spotlight搜索选项和增强的图标显示，你可以快速浏览多页文档或者观看 QuickTime影片。【详细了解】

2. 苹果iPhone OS 3.0将在6月17日正式上线

在全新版本的iPhone OS 3.0固件中，相比之前的2.X固件，苹果公司做了较大的升级，其中比较终要的几点是：支持彩信、支持手机全局搜索、支持复制粘贴操作、支持蓝牙点对点的文件传输、支持转发短信、支持流媒体文件的浏览等等，总共大大小小的改建在100处以上。【详细了解】

3. 苹果Safari 4正式版发布华丽又快速

苹果的Safari 4浏览器以速度快与界面华丽而倍受关注，采用先进的Nitro引擎，拥有世界上最先进的渲染技术，即使运行要求十分苛刻的 Web 2.0 应用程序，Safari 仍可展现极其快速的性能表现。Safari 4执行JavaScript的速度超快，速度上超越了FireFox、Internet Explorer 和 Google Chrome浏览器。同时Safari不仅拥有卓越的 JavaScript 执行性能，还具备顶级的 HTML 执行性能。【详细了解】

二、Windows 7系统区

1. Windows 7 build 7231 x86泄露BT种子

刚刚从国外网站上发现Windows 7的又一最新版本泄露出来，Windows 7 build 7231（32位版），并且带有种子，喜欢的网友赶快下载。【详细了解】

2. Windows 7 SP1 build 7227被泄露出来

国外P2P网站上之前泄露的Windows 7 SP1 build 7227种子，不过只有32位版本。同时，还有一些截图一起被曝光。【详细了解】

3. Windows 7 Manager 1.0.3 Win7全能系统工具

Windows 7 Manager是一个功能十分强大的优秀Windows 7系统工具，这款国外软件能够帮助Windows 7用户清理、优化和管理系统，提高系统安全性和运行速度，让你的Windows 7系统性能更佳。最新版Windows 7 Manager中再次添加了一些实用工具，并且对1-Click Cleaner，Process Manager，Service Manager等工具进行了版本升级。【详细了解】

三、安全杀毒

1. 卡巴斯基手机安全软件8.0上市瞄准3G市场

6月9日，国际领先的信息安全解决方案提供商——卡巴斯基实验室在京发布了其最新的手机安全软件产品。卡巴斯基手机安全软件8.0支持 Symbian9.1、9.2、9.3操作系统和Windows手机版5.0、6.0、6.1，是一款专为智能手机设计的、全方位的安全解决方案。它融合了最新的手机安全技术研发成果，包含反病毒、反盗窃、反垃圾短信和来电、隐私加密、家长控制、SIM状态监控、GPS定位等诸多功能。【详细了解】

2. 微软免费杀毒软件新品Morro即将公测

据最新消息称，微软即将推出最新免费反病毒软件Morro的第一个公测版，Morro的到来将填补上微软One Care离开后留下的空白地带。Morro就是一个功能专一的反病毒软件而不会附带创建备份和防火墙等额外功能。【详细了解】

3. 金山毒霸亮相<终结者2018>北京首映礼

国内知名互联网信息安全公司金山软件宣布，正式与索尼影视娱乐有限公司旗下哥伦比亚电影公司出品科幻电影《终结者2018》（又译为：《终结者4》、《终结者：救世主》）展开合作。6月7日，金山毒霸高调亮相《终结者4》北京首映礼，为两家企业的合作拉开了划时代意义的序幕。金山也成为索尼在中国互联网信息安全领域迄今为止唯一合作伙伴。【详细了解】

四、影音播放

1. PPS网络电视 2.6版更新支持Windows 7系统

大家熟悉的PPS网络电视2.6.86.8800版已经发布，最主要的改进就是在于支持Windows 7操作系统，现在的确已经有不少网友已经早已使用上Windows 7，而且对其是爱不释手，但是想要观看网络电视却苦于没有适合的网络电视软件能够在Windows 7上运行，现在好了，用最新版PPS就没有问题啦！【详细了解】

2. 流行播放器KMPlayer 2.9.4更新版发布

KMPlayer作为一款当今流行的全能影音播放器，其功能强大，支持格式多种多样并且简单易用，几乎可以播放现在流行的所有影音文件，同时 KMPlayer可以支持层出不穷的新格式。KMPlayer还允许用户通过各种插件扩展增强功能，如直接使用Winamp的音频，输入，视觉效果等插件。通过KMPlayer独有的扩展能力，用户可以选择使用不同解码器对各种格式进行解码。【详细了解】

3. 美丽升级一百分酷我音乐盒 2.4.1新版

酷我音乐盒的界面以美观实用著称，上个新版本中增加的分拆式皮肤就让很多人惊艳。这次新版本中又增加了两款漂亮的皮肤界面。另外，酷我音乐盒继续精益求精，对于内容更新技术做了进一步优化，大大提高了歌曲的更新和推荐速度，让好歌更快的直达到用户的面前。【详细了解】

五、网页浏览器

1. 搜狗浏览器 1.3公测版突破带宽限制

搜狗浏览器自推出之日起，就因高速稳定的教育网加速功能而广受用户好评，在刚刚发布的1.3 beta版中，搜狗浏览器在对教育网加速功能进行优化的同时，全面推出“全网加速”功能，将网络加速功能的覆盖范围从教育网扩大至国内所有的主流运营商网络，包括网通、电信、教育网等。【详细了解】

2. 世界之窗浏览器 3.0 RC发布新增多个功能

最新的世界之窗浏览器 3.0刚刚发布RC版，这次大更新不仅陡然增加了许多新功能，同时改进和修复大量特性，推荐世界之窗浏览器的用户更新。其中新增的功能包括保存完整图标功能、自动刷新功能、气泡提示等等。【详细了解】

3. Google Chrome 2.0.172.31最新稳定版

Google Chrome 2.0最新稳定版，Chrome 2.0刚刚在不久前进入稳定版，稳定版中Chrome浏览器增加了全屏显示模式，能够隐藏标题栏等内容，有效增加窗口内可显示空间。Google Chrome提供的自动填写表单功能会记录用户表单的填写记录，再遇到类似的表单时自动为用户填写Chrome知道的信息。【详细了解】

六、网络应用

1. 飞信新体验飞信2008 3.5 正式版发布

中国移动的飞信3.5正式版发布，飞信是一款便捷的沟通工具，通过飞信用户可以使用手机和PC用户聊天，信息交互和发送文件，只要有移动网络的地方就能与好友保持联系。新版飞信开放飞信会员，只要成为飞信会员就能独享飞信特权，好友列表数扩充、创建、加入群数扩充、积分加速等一网打尽！更有会员特权头像、红色昵称彰显不一样的你！【详细了解】

2. 苹果版QQ for Mac 1.0 Beta1最新升级

QQ for Mac是腾讯为苹果电脑用户推出的QQ聊天软件，简洁实用，界面优雅美观。QQ for Mac是一款Universal 应用程序，支持Intel和PowerPC硬件平台，同时兼容Tiger及全新Leopard操作系统。虽然QQ for Mac目前功能没有Windows平台的QQ功能丰富，但是它也支持自定义头像显示，大小头像显示可以随意切换，而且同样拥有高速传输文件功能，随着版本的更新还在不断增加新功能。【详细了解】

3. 腾讯TM2009 Beta版专为办公一族打造

腾讯TM是专为办公一族们精心打造的及时通讯工具，针对办公环境设计，侧重于熟人之间的沟通与联系，正因为这样，TM没有QQ中多种多样的附加功能，看上去更加清爽和简洁。使用TM，可以通过文本、语音、手机甚至视频对话，与同事，客户，朋友，家人实时联机沟通。TM2009 Beta已经发布，采用了全新界面风格，更加清爽简约，同时支持QQ2009中的消息盒子，可以帮助用户将所有未读信息一网收罗。【详细了解】

七、应用工具

1. QQ拼音输入法 2.1新发布打字不再卡

输入速度快，占用资源小且界面精美的QQ拼音输入法最新2.1版发布，增加代理支持，优化用户登录体验，增加等级进度条，同时新添删除皮肤功能，优化相框皮肤的显示等等。QQ拼音输入法能够绑定QQ号码让你将个人词库随身带，智能整句生成，就算打长句也得心应手。【详细了解】

2. 诺基亚PC套件Nokia PC Suite 7.1更新

诺基亚PC套件（NOKIA PC Suite）是众多诺基亚手机用户都常备在手边的一款实用工具，该套件中包含了五个实用程序分别是NOKIA PC Sync、NOKIA Content Copier、NOKIA PC Composer、NOKIA PC Graphics、NOKIA Phone Editor。【详细了解】

3. 免费流行看图器FastStone 3.90正式版

FastStone Image Viewer 是一款免费且小巧的看图软件，它提供使用者方便的操作界面，让使用者可以通过它的操作界面来浏览图片，且还支持了连续播放的功能，让使用者能够轻松的浏览目录中的所有图片。该软件支持所有流行的图片格式，包括BMP, JPEG, GIF, PNG, PCX, TIFF, WMF, ICO等，同时提供了图像浏览、管理、编辑和格式转换等功能。【详细了解】

八、手机软件

1. 手机上网超酷体验新Opera Mobile 9.7

全能手机浏览器Opera Mobile 9.7 beta版全新发布，这是基于Windows Mobile 平台系统的一款超强手机浏览器，“极速”依然成为了本次新版Opera Mobile手机浏览器的最大卖点，同时还集合了锦上添花的Opera Widget网络应用小工具管理功能，使得手机上网变得更简单更快捷。【详细了解】

2. UC浏览器 6.6正式版热门手机浏览器

UC浏览器是目前很多手机用户都在使用的一款流行手机浏览器，无论是WEB网站还是WAP站点都可以通过UC浏览器进行访问，同时UC浏览器推荐数百个WAP和WEB热门站点，无需输入网址，直接点击就能立即浏览网页简单便捷。【详细了解】

3. Windows 7自带用于手机铃声的WMA音乐

Windows 7系统中新增了许多新颖的功能，性能也大幅提高，赢得了大量用户的好评。Windows 7系统中附带了大量精美的桌面墙纸与主题，让很多用户爱不释手，可是也许你还不知道，Windows 7系统文件夹中还隐藏了几段可以被用作手机铃声的MP3乐曲。【详细了解】

4. 手机酷狗 2.04千色版极致华丽能换肤

手机酷狗是一款免费的手机音乐播放软件，内置支持Flac的高品质解码器，支持歌手头像智能识别功能，可以通过GPRS自动下载。并且提供了600万免费的KRC动感歌词库，以及美观的微型播放模式。最新手机酷狗千色版发布，更是在外观上极大改善，提供多种绚丽皮肤倍受用户喜爱。【详细了解】

5. 手机管理 91手机助手 for iPhone 2.5

91手机助手是一款用于智能手机管理的PC端工具软件，能够轻松帮助用户管理手机全面支持iPhone、Windows Mobile和Symbian S60三大智能手机平台，这是iPhone手机使用的版本。该软件新增了主界面中91通行证帐号的登陆国内，添加WEB备份与还原国内，同时提供了一键转机国内模块，支持从iPhone到iPhone的数据互导。【详细了解】

6. 熊猫看书 1.70流行的免费手机阅读器

熊猫看书是一款全新体验式手机免费阅读软件，全面支持TXT、ZIP、CHM、HTML、NDB、NDZ等格式文件，并支持JPG、BMP、PNG、 GIF等多种格式的图像，支持大容量文件瞬间载入，多种便捷人性化操作，海量在线书库，给你一站式的前所未有的人性化阅读体验。【详细了解】

网络环境的安全和净化看来将长时间作为人们热议的话题，随着3G的全面铺开，越来越多用户开始使用手机与上网本随时上网，网络与人们的生活越密切，网络环境的问题也就越发突出，不过要想创建一个安全纯净的网络环境我想是离不开所有网民的大力支持与共同努力的。■

Web自动化测试工具Selenium 1.0正式发布:Chrome支持+用户指南

2009-06-15T10:52:00.000+08:00

Selenium 是一款开源Web自动化测试工具，最近发布了1.0版，标志着Web自动化测试领域正式加入了一名新成员。在其新版本中，除了修正了若干Bug，最引人瞩目的就是Selenium RC增加了对Google Chrome浏览器的支持，同时Selenium官方网站上提供了完整的用户指南。

InfoQ一直关注Selenium的成长，赵劼在.NET平台下Web测试工具横向比较一文中对Selenium做了概括：

严格说来，Selenium 是一套完整的Web应用程序测试系统，它包含了测试的录制（Selenium IDE ）、编写及运行（Selenium Remote Control ）和测试的并行处理（Selenium Grid ）。Selenium的核心Selenium Core 基于JsUnit ，完全由JavaScript编写，因此可运行于任何支持JavaScript的浏览器上。Selenium Core由一种指定格式的HTML文件驱动，在一定程度上增强了测试套件（Test Suite）的可读性。Selenium Remote Control允许测试人员使用常见的语言（自然包括C#等.NET语言）编写测试代码，并支持不同操作系统下的各种主流浏览器。Selenium Grid的作用是将测试分发至多台机器，这样便可大大加快测试速度。与WatiN相同，Selenium也是一款同样使用Apache License 2.0协议发布的开源框架。

从读者对上文的回复中也可以看出，国内社区对Selenium的喜爱和关注也在升温。

Selenium作为一款Web自动化测试工具，其支持的浏览器类型之多一直为社区所乐道，而在1.0版中，Selenium正式加入了对Google Chrome的支持：

Selenium Remote Control采用浏览器参数googlechrome调用Google Chrome，在Windows XP/Vista上已通过测试，Chrome支持由Google人员完成。

至此，除了对IE8的支持功能还在开发中，其他所有主流浏览器都可以通过Selenium来自动化驱动以测试Web应用。

Selenium的官方网站在Selenium 1.0发布之际，正式推出了Selenium的用户指南。在此之前，用户只能通过有限的文字介绍和论坛来学习Selenium。现在，负责文档写作的团队完成了一份较为完整的Selenium用户指南，主要包括：

除此之外，Selenium 1.0还包括了以下重要更新：

不过在Selenium 1.0中，shutDownSeleniumServer命令由于之前的代码重构错误而不起作用，因此Selenium团队随即发布了1.0.1版本，以修正该Bug，最新版可以从这里下载。

令人欣喜的是，国内社区在学习和使用Selenium之余，也针对其不足提出了新的Web自动化测试框架，Tellurium 就是其中一个。目前InfoQ中文站张凯峰对此做了专题报道，Tellurium的创始人方剑先生在采访中谈到了Selenium的不足：

我有个工作（Task）就是用Selenium去测试我们的一个应用程序（是用Dojo Javascript框架写的）。应该说在当时，Selenium是一个开创性的框架，如果用他们的复制和重播模式（record and replay）很容易产生测试脚本。但一旦我开始用Selenium，我发现它还是有一些缺点和不便之处。主要测试脚本是对代码的更新很脆弱（Fragile）。但是在一个敏捷开发的环境下，一般都有阶段性的用户接受测试（User Acceptance Test），由于程序一直更新，Selenium测试脚本的维护就变成一个很头痛的问题。而且，对于很多企业级应用，复制和重播模式本身就不太适用，比喻我们有很多数据格（Data Grid），它的内容本身就是动态的。其他的问题包括Selenium测试脚本不是结构化的，你可以看到处有XPath，这更增加了维护的困难。

他同时表示，Tellurium脱胎于Selenium,它的主要竞争对手还是Selenium, 毕竟Selenium已经推广好几年了。要用户用一个新的框架是要花一定的时间的。

由此可见，Web自动化测试工具的竞争愈演愈烈。但不论是Selenium还是Tellurium，软件开发社区都是最终的评判者和受益者。读者可以在InfoQ中文站查看更多有关测试的报道。

JavaScript大牛：Douglas Crockford

2009-06-15T10:51:00.001+08:00

Douglas Crockford是JavaScript开发社区最知名的权威人士，JSON、JSLint、JSMin和ADSafe之父，《JavaScript. The Good Parts》（中文书名为《JavaScript语言精粹》）一书作者。JavaScript的创始人Brendan Eich说他是“lambda编程和JavaScript的精神领袖（Yoda of lambda programming and JavaScript）”。他同时也服务于ECMA的JavaScript2.0技术委员会（TC39）。其个人站点和Blog分别为：http://www.crockford.com/和http://blog.360.yahoo.com/douglascrockford。

Douglas Crockford为Yahoo资深JavaScript架构师。此外，他曾在Atari公司开发了办公自动化系统，同时完成了对游戏和音乐的研究；曾任 Lucasfilm电影公司技术总监；在Paramount公司担任过新媒体执行主管；在电气社区，他为人所知的是communities.com的创始人兼首席执行官；他还创办了State软件公司，并兼任CTO，这也是他发现JSON时的所在地。他同时也对Blissymbolics这一图形及象征性语言非常感兴趣，并研究过永久减肥（Permanent Weight Loss）。

YUI团队2008年底的合影，中间的长者即为Douglas Crockford：

《JavaScript: The Good Parts》英、中文版图书封面：
http://p.blog.csdn.net/images/p_blog_csdn_net/bvbook/505170/o_s2931482_3.jpg
http://p.blog.csdn.net/images/p_blog_csdn_net/bvbook/505170/o_01-JavaScript%E8%AF%AD%E8%A8%80%E7%B2%BE%E7%B2%B9-%E5%B0%81%E9%9D%A2_1.png

Douglas Crockford作为JavaScript开发社区的领袖，其在JavaScript开发方面的研究成果被广泛应用，而他的思想也深深影响了整个 JavaScript应用和发展。学习、理解、实践大师的思想，我们才可能站在巨人的肩上，才有机会超越，因此，以下列表是一个开始：

1.JavaScript. TheWorld'sMost Misunderstood Programming Language（网址：http://javascript.crockford.com/javascript.html）
参考译文：JavaScript：世界上最被误解的语言（网址：http://shiningray.cn/javascript-the-worlds-most-misunderstood-programming-language.html）

2.The World’s Most Misunderstood Programming Language Has Become the World’s Most Popular Programming Language（网址：http://javascript.crockford.com/popular.html）
参考译文：JavaScript：从最受误解的编程语言演变为最流行的语言（网址：http://www.ajaxjs.com/popular.html

3.A Survey of the JavaScript. Programming Language（网址：http://www.crockford.com/javascript/survey.html）
参考译文：纵览JavaScript语言（网址：http://svza.blogspot.com/2007/03/javascript_09.html）

4.Code Conventions for the JavaScript. Programming Language（网址：http://javascript.crockford.com/code.html）
参考译文：JavaScript程序编码规范（网址：http://www.yeeyan.com/articles/view/cloudwater/4042）

5.The Little JavaScripter（网址：http://javascript.crockford.com/little.html）

6.Private Members in JavaScript（网址：http://javascript.crockford.com/private.html）
参考译文：JavaScript中的私有成员（网址：http://javascript.crockford.com/private.html）

7.Prototypal Inheritance in JavaScript（网址：http://javascript.crockford.com/prototypal.html）
参考译文：在JavaScript实现基于原型的继承（网址：http://svza.blogspot.com/2007/03/javascript_14.html）

8.Classical Inheritance in JavaScript（网址：http://javascript.crockford.com/inheritance.html）
参考译文：在JavaScript中实现基于类模式的继承（网址：http://svza.blogspot.com/2007/03/javascript_4663.html）

9.Remedial JavaScript（网址：http://javascript.crockford.com/remedial.html）

10.JavaScript. and HTML Script. Tags（网址：http://javascript.crockford.com/script.html）
参考译文：JavaScript与HTML的Script标签（网址：http://www.dreamdu.com/blog/2008/08/08/script/）

11.JScript. Memory Leaks（网址：http://javascript.crockford.com/memory/leak.html）
参考译文：JScript的内存泄漏（网址：http://svza.blogspot.com/2007/06/jscript.html）

12.Top Down Operator Precedence（网址：http://javascript.crockford.com/tdop/tdop.html）

13.The Elements of JavaScript. Style, Parts One and Two（网址：http://javascript.crockford.com/style1.html和http: //javascript.crockford.com/style2.html）
参考译文：JavaScript的风格要素（1）&（2）（网址：http://dancewithnet.com/2008/01/26 /the-elements-of-javascript-style-part-one/和http://dancewithnet.com/2008 /01/30/the-elements-of-javascript-style-part-two/）

14.Minification v. Obfuscation（网址：http://yuiblog.com/blog/2006/03/06/minification-v-obfuscation/）

15.Synchronous v. Asynchronous（网址：http://yuiblog.com/blog/2006/04/04/synchronous-v-asynchronous/）

16.with Statement Considered Harmful（网址：http://yuiblog.com/blog/2006/04/11/with-statement-considered-harmful/）

17.Global Domination, Parts One and Two（网址：http://yuiblog.com/blog/2006/06/01/global-domination/和http: //yuiblog.com/blog/2008/04/16/global-domination-part-two/）

18.for in Intrigue（网址：http://yuiblog.com/blog/2006/09/26/for-in-intrigue/）

19. JavaScript, We Hardly new Ya（网址：http://yuiblog.com/blog/2006/11/13/javascript-we-hardly-new-ya/）
参考译文：JavaScript的new，好久不见啊（网址：http://ued.taobao.com/blog/2007/05/15/%E4 %BD%A0%E7%9C%9F%E7%9A%84%E4%BC%9A%E5%86%99javascript%E5%90%97%EF%BC%9F/）

20.JSON and Browser Security（网址：http://yuiblog.com/blog/2007/04/10/json-and-browser-security/）
参考译文：JSON和浏览器安全（网址：http://www.javaeye.com/topic/95569）

21.I’d Rather switch Than Fight!（网址：http://yuiblog.com/blog/2007/04/25/id-rather-switch-than-fight/）

22.The Only Thing We Have To Fear Is Premature Standardization（网址：http://yuiblog.com/blog/2008/08/14/premature- standardization/）
参考译文：不成熟的标准化是我们唯一惧怕的（网址：http://ued.taobao.com/blog/2008/08/15/the_only_thing_we_have_to_fear_is_premature_standardization/）

23.When You Can’t Count On Your Numbers（网址：http://yuiblog.com/blog/2009/03/10/when-you-cant-count-on-your-numbers/）

24.Fixing HTML（网址：http://www.crockford.com/html/）
参考译文（网址：http://sp42.javaeye.com/blog/145268）

25.HTML4.2（网址：http://blog.360.yahoo.com/blog-TBPekxc1dLNy5DOloPfzVvFIVOWMB0li?p=978）

26.Ajax security（幻灯片，网址：http://www.slideshare.net/douglascrockford/ajax-security-255587）

27. JavaScript. The Good Parts
（1）视频（网址：http://google-code-updates.blogspot.com/2009/03/doug-crockford-javascript-good-parts.html）
（2）幻灯片（网址：http://www.slideshare.net/rajivmordani/good-parts-of-javascript-douglas-crockford-presentation）

28.The Mashup Problem and Google Gears
（视频，网址：http://video.google.com/videoplay?docid=452089494323007214）

29.The JavaScript. Programming Language
（1）视频第1部分（网址：http://video.yahoo.com/video/play?vid=111593）
（2）视频第2部分（网址：http://video.yahoo.com/video/play?vid=111594）
（3）视频第3部分（网址：http://video.yahoo.com/video/play?vid=111595）
（4）视频第4部分（网址：http://video.yahoo.com/video/play?vid=111596）
（5）幻灯片（网址：http://www.slideshare.net/guestceb98b/the-javascript-programming-language）

30.An Inconvenient API: The Theory of the Dom
（1）视频第1部分（网址：http://video.yahoo.com/video/play?vid=111582）
（2）视频第2部分（网址：http://video.yahoo.com/video/play?vid=111583）
（3）视频第3部分（网址：http://video.yahoo.com/video/play?vid=111584）
（4）幻灯片（网址：http://www.slideshare.net/kavenyan/the-theory-of-the-dom）

31.Advanced JavaScript
（1）视频第1部分（网址：http://video.yahoo.com/video/play?vid=111585）
（2）视频第2部分（网址：http://video.yahoo.com/video/play?vid=111586）
（3）视频第3部分（网址：http://video.yahoo.com/video/play?vid=111587）
（4）幻灯片（网址：http://www.slideshare.net/Adieu/advanced-javascript）

32.Quality
（视频，网址：http://video.yahoo.com/watch/529579/2724346）

33.JavaScript. The Good Stuff
（视频，网址：http://video.yahoo.com/watch/630959/2974197）

34.The State of Ajax
（视频，网址：http://video.yahoo.com/watch/1382941/4760685）

35.Ajax Performance
（1）视频（网址：http://video.yahoo.com/watch/4156174/11192533）
（2）幻灯片（网址：http://www.slideshare.net/kavenyan/ajax-performance）
（3）英文演讲词（网址：http://ericmiraglia.com/blog/?p=140）
（4）参考译文（网址：http://blog.360.yahoo.com/blog-sOW1QOA9crUyOdXFxOeK4xc-?cq=1&p=200）

转载自：http://dancewithnet.com/2009/03/29/douglas-crockford/

廉价货币昂贵楼市

2009-06-15T10:49:00.004+08:00

钟伟北京师范大学金融研究中心教授

楼市经历了一个不太冷的冬天之后，由次贷迅速带来了盛夏，它正在发生而众人尚未察觉，廉价货币，昂贵楼市，以后总会有人在盛宴之后赶来收拾残羹冷炙

博鳌21世纪房地产论坛在即，因此我在近期增加了对房地产月度数据的处理。

如同大多数开放式基金经理具有一定的资产配置能力，但基本不具备时机选择能力一样，开发商的宏观形势判断也相当滞后，这可能和房地产行业的集中度太低有一定关系。在2007年下半年的博鳌，当我们尝试讨论土地囤积的风险时，一位开发商以傲慢的口气打断讨论说，我们不用浪费时间讨论不可能发生的问题。在今年3 月的杭州，当我们乐观地认为房地产市场全年价平量增持续回暖，销售面积和金额均可能接近甚至超越历史最高点的2007年时，一向乐观的任志强也用半信半疑的眼光对我说，你这么乐观和肯定，4月份房地产统计数据出来如果又滑坡怎么办？媒体的主流看法是，楼市不过是小阳春，其中包含开发商自欺欺人的成分。

当前的楼市趋势如何？对不起，我倾向性的意见是：由于次贷危机带来的令人惊讶的廉价货币，一线城市的楼市调整在1季度已结束，全国楼市调整在2季度大体结束，目前去存货化进程迅速、市场需求从刚性需求的释放，已经扩散到投资性需求的猛烈升温。预期2009年全年商品房销售量和销售金额比2007年的历史高位分别约高出10%和15%。土地出让和房地产投资的增速不会如此惊人，但也会有一定程度的回暖。或者说，目前的楼市不是小阳春，而很可能转眼即是盛夏。

很少有人愿意接受上述乐观判断。重要的不是观点，而是赖以得出观点的数据和逻辑。乐观的理由在哪里？

一是对中国经济走势的判断。我一直坚持V型反转是宏观经济的基本趋势，考虑到不存在所谓“次贷危机第二波”，以及今年年底明年年初美国经济摆脱衰退的弱势复苏，考虑到目前中国GDP增长中，消费和投资并举，服务业超越制造业，我们的结论是：今年GDP增速保8，明年超9，规模以上工业企业盈利增长约10%左右，该结论比大多数判断要乐观得多。当然，我们倾向于认为今明两年摆脱通货紧缩、甚至转入通货膨胀的可能性均不大，这也许又比较悲观。在这样的宏观预期下，楼市作为资产价格的一部分，调整行将结束。中国经济异乎寻常的强劲复苏，已充分体现在投资增速、钢铁和铜等黑色有色金属的消耗量、股市和楼市的表现上。

二是对廉价货币投放的理解。如果不仔细观察数据，你很难理解在过去30年，中国投放了多么巨额的货币，目前M2/GDP的比率是全球之首。M2每年同比增长12%曾被视为保持经济平稳增长的“经验公式”，但在次贷危机后增速已翻番，全年信贷很难不突破8万亿。从1998到2007年，城镇单位就业人员平均劳动报酬，国有企业从每年7600元上升到26100元。北京市中位数家庭人均年收入则从9400元上升到23200元，这种货币化进程几乎是匪夷所思的。在次贷危机爆发之后，如果按经济刺激方案对GDP的占比来看，中国的经济刺激方案力度甚至超过了美国。廉价货币的大量注入，并非使得产能过程的实体经济从中受益，而是推动股市、楼市等资产价格的上涨。股市现在牛熊之争可能渐渐失去悬念，但对楼市的未来趋势尚无共识。考虑到目前57折的5年期以上按揭利率已低到4%，比中国中长期通货膨胀4.8还要低；考虑到中长期国债的收益率尚不足3%，而房地产项目开发的资本金要求已降至20%，廉价货币使得本应中期深度调整的楼市，目前已草草收场，迎来转机了。

三是一季度的回暖指标惊人。尽管目前对发电量和GDP增长之间的背离、货币供应量和财政收入之间的背离等等存在纷争，但可能许多研究人员忽略了其他一些回暖指标太过惊人。金融40人的内部论坛上，中金证券研究认为美国经济甚至第三季度即可摆脱深度衰退，徐刚则乐观认为V型反转导致全年资产价格逐波向上，高善文则指出目前钢材、铜的表观消费量，已超过2007年景气巅峰时刻。

我们观察到的房地产行业数据显示，第一季度深圳新房和北京二手房的交易量，均是历史天量。2007年，全国商品房销售面积、竣工面积和销售金额分别为7.7亿平米、6亿平米和2.9万亿，我们预期今年销售面积和金额均接近甚至超过2007年，而竣工面积则很可能创下历史新高。考虑到全年土地出让和房地产开发投资的相对平稳，因此目前楼市的回暖具有两大特点，一是消费需求从刚性需求的释放向投资需求扩散，这表现为二手房交易有所降温的同时新房和别墅交易升温；二是开发供应的去存货化速度快于预期，目前全球平均减少了3－4个月的存货，去存货化进程已完成1/3。因此楼市的回暖的确不是虚假的小阳春，而是新一轮盛夏的前兆。

总体上，经济刺激政策的波及效应、廉价而充沛的信贷，销售的迅猛回暖、对供应商和建筑施工企业的三角债拖欠、以及项目资本金要求的下降，都给了开发企业以巨大的喘息之机。该出局的开发商侥幸幸存了，该以品牌、产品和服务争取购房者的又在组织客户排队了，该维持房价向理性回归的又陷入狂热冲动的迹象了。看起来优秀房地产开发企业的股票比其开发的楼盘更有交易性机会。楼市经历了一个不太冷的冬天之后，由次贷迅速带来了盛夏，从价值判断角度，我不知道这是好是坏，只知道它正在发生而众人尚未察觉，廉价货币，昂贵楼市，以后总会有人在盛宴之后赶来收拾残羹冷炙。（原载《南方周末》）

10个jquery动画菜单：插件和教程

2009-06-15T10:49:00.001+08:00

jquery是一个非常容易使用，同时也是扩展性很好的一个javascript框架。使用jquery可以非常容易的实现一些页面的ajax效果。本文收集一批使用jquery实现很酷的动画效果菜单的插件和教程。

插件

LavaLamp

相信很多人都见过这个很酷的菜单插件，也有很多网站成功的应用了这个插件。

插件主页

jquery Kwicks 插件

如果你多Mootools有些了解，或许会注意到Mootools上一版主页的一个滑动菜单效果(现在已经看不到了)。这个插件就是来自于这个效果，很酷，也很容易定制。使用这个插件不仅仅可以制作非常个性的菜单，制作某些步骤演示也非常合适——比如购物流程的演示。插件主页

查看演示 | 下载

仿Mac的停靠菜单插件

这是个仿苹果机的停靠菜单的一个jQuery插件，支持水平和竖直两种。查看插件页面。

查看演示 | 下载

jquery滑动菜单

一个和LavaLamp很像的菜单，而且脚本只有不到1kb(lavalamp也是这么小)，也比较容易使用。该菜单的原理是，通过在当前ul元素的下面(或者说”后面”更合适些？)添加一个额外的div，用position定位该div。然后用jquery和插件来控制这个div的大小和位置，并实现动画效果。

查看演示 | 下载

教程

CSS Sprites2 – 使用jquery制作动画菜单

知名博客alistapart 的一个关于CSS Sprites的教程，这个网站对CSS Sprites的技术的普及起到了非常重要的作用。本文的目的是介绍基于javascript的CSS Sprites技术，只是是通过制作动画菜单的例子来讲解。非常值得一读。查看教程

查看演示

使用jQuery的动画菜单

教你如何使用CSS和jquery的animate()函数改变背景色的透明度(opacity)来实现动画菜单的一个教程，讲的很详细，如果你看不懂英文没关系，能看懂教程中的代码就OK了。查看教程

查看演示

使用CSS和jquery创建很酷的动画导航菜单

Nettus推出的一个教程，非常详细 的讲解如何使用CSS和jquery制作很酷的动画效果的菜单。查看教程

查看演示 | 下载源文件

CSS Dock Menu

来自www.ndesign-studio.com 的一篇使用CSS制作停靠菜单的教程，使用了jquery机器FishEye插件。查看教程

查看演示 | 下载

使用jquery制作平滑的动画导航

一个很不错的导航效果，这个教程很详细的讲解了制作这个菜单的步骤。使用了jquery的easing组件。查看教程

查看演示 | 下载

使用jquery实现动画背景图片

这是一个教程，作者结合了上面提到的CSS Sprites2教程，结合jquery 背景动画插件来实现的一个效果。这个效果很不错，很酷。查看教程。

查看演示 | 下载

提高网站可用性的十个实用小技巧

2009-06-15T10:47:00.000+08:00

2009-06-11 15:17 作者：oncoding 出处：天极网责任编辑：盛晓莹

　　不论是企业网站、个人博客，或者购物网站、游戏网站，我们都希望能吸引访问者并且给他们留下愉快的访问体验。

　　可用性是用户体验的一种度量，它可以用访问者完成网站功能的方便程度来描述——无论是通过自身知识还是通过学习新方式来完成这种功能。我认为Jakob Nielson的解释非常到位，他说：

　　可用性是评估网站易用程度的一种属性。同时“可用性”这个词也指在设计过程中提高易用性的方法。

　　在本文中我希望能够提供一个可用性清单，内容覆盖了从视觉设计，到可以用在任何项目中的简单导航提示等多个方面。

　　1. 当前位置导航

　　要让用户在任何时候都知道自己身处哪个模块，或者在浏览那个分类。对任何网站来说，这都可以极大提升可用性。在这一点上，创建当前位置导航可以算是最有效的提升可用性方式。

　　当前位置导航的理想方式是在服务端创建，这样可以大量节省HTML和CSS代码。如果不方便在服务端创建导航，那么使用CSS操纵你的body元素从而直接定义每个导航标签也是一个不错的方法。

　　另外，你可以方便的使用JavaScript创建当前位置导航菜单。

　　要注意，你的当前位置导航最好和鼠标滑过样式保持不同，这是很多网站缩不注意的。

　　2. 可用的表单标签和按钮

　　使用HTML的label属性，可以让用户通过点击注释标签来激活表单元素，这是HTML的一个伟大的内置功能，但不幸的是，很少有用户知道这回事。

　　怎样让用户了解这个功能呢?你可以通过改变鼠标指针形状的方式来提醒用户，这只需要一两行代码就可以实现。

　　做成这样之后，用户就很容易的知道这标签是可以点的，我经常觉得HTML标准里没有把这些可以点的元素统一设置为小手指针是非常不应该的，所以我通常我会这样统一定义：

　　label, button, input[type="submit"]{cursor:pointer;}

　　3. 将你的LOGO链接到首页

　　我认为logo不链接到你的网站首页是一件令人沮丧的事情，恰恰有很多网站没有这样做。用户研究表明，这样做是很有必要的，用户需要它!

　　如今越来越多的网站意识到，给LOGO加链接的重要性。用户已不满足于一个标记为“主页”的文字链接，用户希望点一下logo就可以回到首页。

　　拿Facebook为例，它为每一个导航元素增加了“ref”属性来跟踪用户点击。如下图：

　　4. 加大链接的点击面积

　　大约一年前，37Signals 的 Ryan Singer 写了一篇文章来介绍它们在 Basecamp 项目中如何增大链接的可点击面积。这又是一个提升网站可用性的小细节，它只需要你增加链接周围的 padding 值就可以有效增大点击面积。

　　对任何网站来说这都是一个值得尝试的方法，它可以方式用户误点或点不到链接。并且对于手机网页的设计更为重要，因为很多用户使用手指来点击触摸屏上的链接，增大面积可以帮他们更方便的浏览网页。

　　5. 表单元素焦点显示

　　为处于激活状态的表单元素添加焦点显示，越来越成为UI设计的一种趋势。它让用户了解自己做了什么，在做什么。这是一种简单但有效的向用户传递有用细节信息的方式。

　　 6. 提供有用的404错误页面

　　让网站呈现给用户一个大大的 Apache 错误信息会让人很不爽，创建一个友好的、有用的404错误页面是一个不错的解决方法。因为对非开发者来说，“404”这些数字没有任何意义和价值，用户只希望在网站上找到自己需要的信息。

　　要建立一种可以帮助用户正确的找到他们需要的信息的错误提示页面，比如显示一些抱歉的同时，加上搜索框、推荐文章或首页链接等，努力把用户留在网站上，而不要把责任都推给用户输入了错误链接。

　　这里有一些优秀的404页面欣赏：极富创意的404错误页面欣赏

　　7. 创造一个舒适的文字环境

　　如今，网站文案撰写已成为了一个很大的话题，做网站有越来越多的细节需要考虑。

　　从古到今，关于网站文字内容的讨论从未间断并且其标准在一直变化。当年Steve Krug 曾主张缩减掉一半的文字内容，转而用列表的形式呈现它们。

　　但现在不同了，我们需要用和朋友对话的方式来撰写文案，让用户感觉到一种舒适温馨的氛围。这样用户就会少一些局促感，即使他们遇到了使用上的问题，他也会心情愉悦的在网站帮助中寻找解决的办法。

　　8. 调整行距增强可读性

　　行距是可以从书报杂志等传统媒体直接过度到网页上的元素之一，这些内容的研究和改进已经进行了数百年，已经积累了大量优秀的经验。所以你下次设计之前，大可以先翻翻杂志找找灵感。

　　行距是网页设计中经常被忽视或滥用的地方，我通常从1.4倍行距出发开始设计，然后根据设计和内容进行调整。

　　9. 使用空白来区分和归类元素

　　将内容元素归类组合是显示内容的一种方式。你可以使用图片、边框或者仅仅是使用空白来归类区分。使用空白归类内容元素可以创造自然和谐的用户体验，即使是匆匆的一瞥，内容也会一目了然。

　　用户一眼扫过网页(比如阅读TOP10列表时)，首先会注意标题。我们首先希望的是，我们的网站内容很有趣，能吸引用户进一步阅读。但是对用户进行正确的引导，会对内容的展示起到促进和相得益彰的作用。

　　10. 无障碍浏览

　　这里并不是指“508法案” ( 即section 508，美国法律，大体上描述为：某些特殊用户群体，如残疾人，浏览某网站时，如果无法正常获得所期望的信息，那可以依据相关法规，对该网站依法起诉。 ) 这里所说的“无障碍”，指的是为你的用户考虑到方方面面，让他们轻松的找到需要的东西。

　　如果说保证浏览无障碍可以让你的用户不会发怒，不会甩袖子走人，那么“快速响应”则是你留住用户的最后一道防线。

　　如果有决心的话，你可以做所有你能想到的测试，然后多方参考用户的试用意见。目的就是最大限度的留住用户，因为用户个体的意识和习惯之间存在差异，很难找到让所有用户满意的方式。

　　谈到“无障碍浏览”和“快速响应”，你可能会首先想到视觉障碍人士，但其含义远远超过这些。例如，你必须让你的网站适应用户的带宽限制(拨号上网，手机上网，网速慢等)和旧版本的浏览器(一些公司不会让员工升级浏览器) 。

　　如果我们尽最大努力的消除网站使用的障碍，并且快速的相应网站的问题，我们就能建立一个完善的用户体验，给用户留下良好的印象并且还会再次回来。

十分钟学会Java RMI

2009-06-15T10:46:00.000+08:00

RMI是Java平台实现远程调用的规范，下面是一个小例子，本机测试通过

　　一共有三个java类，远程接口，服务端程序，客户端程序

　　远程接口:

import java.rmi.*; public interface HelloIn extends java.rmi.Remote{ 　String sayHello() throws RemoteException; }

　　服务端程序:

/** * author by http://www.bt285.cn　 http://www.5a520.cn */ import java.rmi.*; import java.net.*; import java.rmi.registry.*; import java.rmi.server.*; public class Hello extends java.rmi.server.UnicastRemoteObject implements HelloIn{ 　public Hello() throws RemoteException{ 　 super(); 　} 　public String sayHello() throws RemoteException{ 　 return "Hello,World!"; 　} 　public static void main(String[] args){ 　 //System.setSecurityManager(new java.rmi.RMISecurityManager()); 　 try{ 　　　　　　 Hello h=new Hello(); 　　　　　 java.rmi.Naming.rebind("hello",h); 　　　　　 System.out.print("Ready......"); 　　 } 　　 catch(Exception e){ 　　　 e.printStackTrace(); 　　 } 　　} }

　　执行服务端程序前在命令行方式下启动rmi的注册程序:　 start rmiregistry

　　客户端程序:

/** * author by http://www.bt285.cn　 http://www.5a520.cn */ import java.rmi.*; import java.rmi.registry.*; public class Helloworld{ 　public static void main(String[] args){ 　 //System.setProperty( "java.security.policy", "client.policy" ); 　 //System.setSecurityManager(new java.rmi.RMISecurityManager()); 　 try{ 　　 HelloIn hi=(HelloIn)Naming.lookup("//fengl/hello"); 　　 for(int i=0;i<10;i++){ 　　　 System.out.println(hi.sayHello()); 　　 } 　 } 　 catch(Exception e){ 　　 e.printStackTrace(); 　 } 　 } 　}

　　执行客户端程序前先用　 rmic Hello　生成Stub 和 Skeleton 的class，它们

　　实际上是远程调用的底层的实现。

　　最后执行java Helloworld 控制台打印出 Hello,World，成功调用.

jQuery实现的快速查找

2009-06-12T11:22:00.001+08:00

By : 愚人码头 | In : 前端框架

jQuery实现的快速查找就是一个列表中查找和你输入的文字相匹配的项，高亮并前置表示；

如图：

jQuery代码：

view source
print?

$(function(){
//键盘按键弹起时执行
$('#index').keyup(function(){
var index = $.trim($('#index').val().toString());//去掉两头空格
if(index == ''){
$('li').removeClass('on');return false;
}
var parent = $('ul');
$('li').removeClass('on');
//选择包含文本框值的所有加上focus类样式，并把它（们）移到ul的最前面
$("li:contains('" + index + "')").prependTo(parent).addClass('on');
});
});

完整 DEMO:http://www.css88.com/demo/jQuery/quickSearch/quickSearch.html

JavaScript 原型链

2009-06-11T13:36:00.001+08:00

<span class="Apple-style-span"   style="  white-space: pre-wrap; font-family:-webkit-monospace;font-size:13px;"><script type="text/javascript">  /*    每个对象实例都有个属性成员用于指向到它的instanceof 对象(暂称为父对象)的原型(prototype)    我们把这种层层指向父原型的关系称为[原型链 prototype chian]    原型也具有父原型，因为它往往也是一个对象实例，除非我们人为地去改变它     在JavaScript中，"一切都是对象，函数是第一型。"    Function和Object都是函数的实例。    Function的父原型指向到Function的原型，Function.prototype的父原型是Object的原型    Object的父原型也指向到Function的原型，Object.prototype是所有父原型的顶层     在spiderMonkey引擎中，父原型可以通过 __proto__ 进行访问 */  Function.prototype.hi = function(){alert('hi Function');} Object.prototype.hi = function(){alert('hi Object');}  var a = function(){     this.txt = "a"; } a.prototype = {     say:function(){alert('a');} }  alert(a instanceof Function);//a是Function的实例; alert(a.__proto__ === Function.prototype);//a的父原型指向到Function的原型;  alert(Function instanceof Object);//Function是Object的实例; alert(Function.__proto__ === Function.prototype);//Function的父原型指向到Function的原型; alert(Function.prototype.__proto__ === Object.prototype);//Function的原型的父原型指向到Object的原型  alert(Object.__proto__ === Function.prototype);//Object的父原型指向到Function的原型; alert(Object.prototype.__proto__);//Object的原型是所有父原型的顶端，它不再具有父原型;   alert(a.prototype instanceof Object);//a的原型也是一个对象 alert(a.prototype.__proto__ === Object.prototype);//a的原型的父原型指向Object的原型    var A = function(){}; A.prototype = new a(); A.prototype.say = function(){     alert('A'); }  alert(A instanceof Function);//A是Function的实例 alert(A.__proto__ === Function.prototype);//A的父原型指向到Function的原型 alert(A.prototype instanceof a);//A的原型是a的实例 alert(A.prototype.__proto__ === a.prototype);//A的原型的父原型指向到a的原型   var iA = new A();//iA是A的实例,iA.__proto__ === A.prototype var iB = new a();//iB是a的实例,iB.__proto__ === a.prototype  iA.hi(); /* iA本身没有hi方法（构造中没有，自己也没有定义过）， 于是找iA.__proto__即A.prototype，也没有找到， 于是再找A.prototype.__proto__即a.prototype，仍然没有发现， 继续查找a.prototype.__proto__即Object.prototype，哇，发现了hi，于是调用它，停止查找 输出：hi Object */  iB.hi(); /* iB本身没有hi方法（构造中没有，自己也没有定义过）， 于是找iB.__proto__即a.prototype，仍然没有发现， 继续查找a.prototype.__proto__即Object.prototype，哇，发现了hi，于是调用它，停止查找 输出：hi Object */  a.hi(); /* a本身没有hi方法（构造中没有，自己也没有定义过）， 于是找a.__proto__既Function.prototype，哇，发现了hi，于是调用它，停止查找 输出：hi Function */  iA.say(); /* iA本身没有say方法（构造中没有，自己也没有定义过）， 于是找iA.__proto__即A.prototype，哇，发现了say，于是调用它，停止查找 所以，这里调用的是A.prototype.say 输出：A */  iB.say(); /* iB本身没有say方法（构造中没有，自己也没有定义过）， 于是找iB.__proto__即a.prototype，哇，发现了say，于是调用它，停止查找 所以，这里调用的是a.prototype.say 输出：a */  iA.bad(); /* iA本身没有bad方法（构造中没有，自己也没有定义过）， 于是找iA.__proto__即A.prototype，也没有找到， 于是再找A.prototype.__proto__即a.prototype，仍然没有发现， 继续查找a.prototype.__proto__即Object.prototype，终于是找不到了，停止查找 返回错误，iA.bad不是一个function */  </script>  感谢simon提出的修正意见！所有实例在查找属性方法时不会去查找自己的prototype(实例的prototype不在原型链内，只能作为一个属性)！  </span>

Google Wave的架构

2009-06-10T17:11:00.002+08:00

作者 Abel Avram 译者王丽娟发布于 2009年6月3日上午12时54分
社区 Architecture 主题协作标签 Google Wave
Google Wave是一个工具，也是一个平台、还是一个协议。其架构的核心是操作转换（Operational Transformation，OT），这是一个支持并发控制的理论型框架。

首先需要看看Google Wave的定义：

Google Wave是基于托管型XML文档（称为Wave）的新型沟通、协作平台，支持并发修改和低延迟更新。

工具

Google Wave是一个兼备电子邮件、即时通讯、协作文档共享和编辑的工具。在Chrome、Firefox、Safari等浏览器里运行的客户端中（包括移动平台iPhone和Android），Wave使用JavaScript和HTML5，Wave在服务器端则结合使用Java和Python，但服务器端可以用用户希望的任何方式来实现。该工具用GWT构建，并使用Google Gears处理HTML 5中尚未包含的拖拽。该工具需要专门的服务器来处理并发通讯，大型团队尤其需要这样的服务器。服务器可以放在企业外的云里，也可以放置在私有企业内部，或者只是放在某人的家里。

Google Wave上周在Google I/O大会期间进行了展示。

平台

Google Wave带有一个公共的API，Google公司承诺在产品正式上线之前会开源整个平台。作为平台，Wave允许开发人员修改基础代码、使用Gadgets和Robots对其进行扩展。Gadgets是运行在Wave中的小程序，而Robots则是“自动的Wave参与者”。Wave还可以嵌到博客等其它媒体当中。

协议

数据模型

Google Wave数据模型的主要元素有：

Wave——每个Wave都有一个全局唯一的Wave ID，并包含一组Wavelet。

Wavelet——Wavelet在其所属的Wave中有一个唯一ID，Wavelet由一个参与者列表和一组文档组成。Wavelet是并发控制/操作转换请求的实体。

参与者——参与者由Wave地址确定，Wave地址是文本字符串，格式与电子邮件地址相同（local-part@domain）。参与者可以是用户，也可以是组，或者是Robot。每个参与者在参与者列表中最多可出现一次。

文档——文档在其所属的Wave中有一个唯一ID，由一个XML文档和一组“分离”注解组成。分离注解指向XML文档，不依赖于XML文档的结构。它们用来表示文本格式、拼写建议和超链接。文档在Wavelet中构成一棵树。

Wave视图——Wave视图是特定用户在一个Wave中访问的Wavelet子集。用户只要是Wavelet的参与者，或者是参与者组的成员（组可以嵌套），都可以访问Wavelet。

操作转换

这是Wave技术的重要组成部分。Google Wave广泛使用了在服务器端执行的操作转换（OT）。当用户编辑多个用户同时打开的协作文档时，客户端程序会提供一个Optimistic UI，立即显示用户输入的内容，同时将编辑操作发送给服务器，希望该操作能被服务器接收。客户端等待服务器评估该操作，在服务器应答之前会缓存其它所有的操作。服务器应答之后，所有被缓存的操作会从客户端批量发送到服务器。服务器考虑从其它客户端接收到的操作，相应地转换操作，并将该转换通知给所有的客户端，客户端相应地更新其UI。操作被发送至服务器，并由特性规则根据特性传播到各个客户端，除非该操作是批量操作。服务器是文档及其版本的管理者，其中版本被认为是“正确的”版本。最后，各个客户端会根据从服务器接收到的最终版本进行更新，该最终版本可能是很多操作转换的结果。还有很多针对通讯失败或服务器/客户端崩溃而提供的恢复措施。为了迅速地识别误传，在客户端和服务器间交换的所有XML文档只带一个总和校验码。

客户端-服务器协议

操作。Wave的基本组成部分Wavelet经过一系列被称为操作转换的改变。这些改变需要传播并应用到每个客户端，否则客户端就不能同步。

操作队列。所有对Wavelet的操作都按照严格的顺序发送。服务器对一个操作做出响应之后，下一个操作才会被发送。服务器基于版本号给操作排序。每个客户端都要按照合适的顺序应用操作。

打开Wavelet。要开始与Wavelet通讯，客户端要给服务器发送一个Open请求，里面包含Wave ID和Wavelet ID。服务器响应是一个快照——Wavelet的序列化状态，或者是相应版本的历史散列。

服务器到客户端的通讯。服务器发送到客户端的内容是Delta（一或多个操作的序列）、版本号和历史散列之一。

客户端到服务器的通讯。客户端发送的内容是Delta或版本号。

恢复。通讯失败时，客户端通过发送先前从服务器接收到的散列历史重新打开Servlet。

联盟

Google Wave Federation协议允许多个实体（Wave提供者）彼此分享Waves。Wave提供者可以是在某人家里运行的服务器，为单个用户或所有家庭成员提供Wave，也可以是一家公司、或一个ISP，Google只是另一个Wave提供者。

有用的链接：Google Wave、Google Wave API、Wave协议。

查看英文原文：Google Wave’s Architecture

Google Wave将基于BSD协议开源

2009-06-10T16:59:00.000+08:00

责任编辑：覃里作者：InfoQ 2009-06-09
文本Tag： BSD html Google
　　【IT168资讯】在6月5日于北京举行的谷歌开发者日上，谷歌向参会者介绍了其下一代产品Google Wave以及其背后的HTML 5标准。开源代码倡导者、谷歌主管开源代码的经理Chris DiBona，他表示未来Google Wave将以BSD协议开发源代码。
　　从谷歌移动产品团队工程主管Dave Burke的Google Wave介绍和演示中，可以看出“整合”对于互联网的作用。Google Wave所采用的技术基本都是目前所常用的，比如E-mail、IM、文档、博客和图片等。在Wave中，你可以创建一个富文本格式的邮件，然后与相关人同时进行编辑，而且所有参与人员都可以同时看到所编辑的区域，如果你对邮件编辑的历史感兴趣，通过一个进度条样式的工具就可以回溯定位到所有修改的地方。另外一个有意思的地方是，如果你在Wave中分享的图片被发布到博客上，那么在Wave中对这些图片的评论也会同时显示到博客上，让协作变得无处不在。
　　Google Wave只是HTML语言下一个版本HTML 5的实验作品，在谷歌全球副总裁、大中华区总裁李开复的介绍中，他提到了HTML 5的五个主要功能：
　　·在浏览器中直接控制图形的编辑，可以达到像素级别;
　　·让整合和编辑视频变得非常容易，甚至可以对视频中每一帧进行修改;
　　·可以容易地标识出每个上网者的位置，让地图应用更加精细化;
　　·通过应用缓存和数据库技术，使得网络应用无处不在，让断网成为历史;
　　·Web Workers提供的多线程功能可以在不影响用户界面的情况下在后台执行任务。
　　对于谷歌最近发行的一个用于开发多媒体动画的平台O3D，李开复表示谷歌也在努力使其成为HTML 5的一部分，让在浏览器中用JavaScript开发三维图形和三维网络应用成为可能。另外，目前O3D支持的浏览器包括Chrome、Firefox、 Safari和Opera等，没有提到是否支持微软IE浏览器。
　　在InfoQ中文站对Chris DiBona的采访中，他提到谷歌在未来将基于BSD协议开源Google Wave：
　　选择BSD协议的原因很简单，我们就是希望能够给予希望使用Google Wave代码的人更多的自由度，他可以随意修改源代码，自由使用，基于Wave开发的应用也可以方便地作为商业产品等。而其他协议，包括GPL，都不具备这么大的灵活性。
　　除了介绍新产品Google Wave、O3D和新标准HTML 5外，李开复还简要回顾了其他谷歌代表性产品在过去一年的进展，比如由于携程网、赶集网、大众点评网、去哪儿等数千个中文网站采用谷歌地图API，其地图 API使用量在过去一年增长了8倍;而移动设备综合平台Android目前也已覆盖12个国家，并获得10个移动运营商的支持，其中包括中国移动、中国联通、华为等;OpenSocial标准也取得包括校内网、51.com、天涯、聚友网和一起网等5个国内主要社区的支持等。

JSF自定义复合组件的技巧和窍门

2009-06-04T10:46:00.000+08:00

JavaServer Faces(JSF)提供可扩展的组件模型，开发人员可以创建可重用的组件，使用这些自定义组件提高开发效率和降低开发成本。虽然对于定制和重用而言 JSF 的组件模型非常强大，但是开发人员普遍认为开发 JSF 自定义组件并不容易，因为通常至少需要熟悉 JSF encode/decode 和 state holder 的内部机制并覆盖相应的方法(参考“怀疑论者的 JSF: JSF 组件开发”所述)，如 encodeBegine()、decode()、saveState() 和 restoreState() 等，对于开发复杂的自定义组件，甚至需要深入理解更多的接口，如 NamingContainer、StateHolder、EditableValueHolder 和 ActionSource 等接口。

　　然而，重用 JSF 标准组件的功能可以极大地简化自定义组件的开发，尤其对于自定义复合组件更是如此。在大部分情况下，我们可以重用 JSF 框架已经提供的标准渲染器、状态管理、事件监听器、转换器和验证器。已有的文章或书籍对如何重用这些标准功能涉及很少，本文基于重用的策略提出快速开发 JSF 自定义复合组件的原则和技巧。

　　本文首先总结了 JSF 组件开发的通用原则，然后通过一个例子(Value Scroller 自定义复合组件)的开发详解说明了哪些标准功能可以重用以及如何重用，以达到简化 JSF 自定义复合组件开发的目的。原则与技巧

　　开发 JSF 自定义复合组件主要有两个原则，一方面强调重用已有的标准组件;另一方面如何确保自定义组件易于重用。

　　1.尽可能的重用标准组件的功能和实现

　　传统的自定义复合组件开发建议完全覆盖实现 encode/decode 逻辑，但这样做耗费时间而且容易出错。毫无疑问，我们可以通过重用标准组件的渲染器等机制减少甚至根本不用自行编写这部分代码。另外，为了实现灵活的配置和使用，自定义复合组件通常需要提供很多属性，我们需要写很多代码来处理这些属性的读写和状态管理。实际上，我们可以简单地把自定义复合组件的属性传递给它自身包含的标准组件，由已有的标准代码去处理这些属性，而不用重复写这些代码。

　　2.清晰地分离组件类、标签类和模型类

　　JSF 的组件模型建议在组件类、标签类和模型类之间有明确清晰的责任分配，以便于重用和扩展。组件类不应该依赖于 javax.faces.component.html 包，因为组件类不仅可以用于 HTML，而且还应该可以重用于其它标记语言(如 WML)。也就是说组件类不应该直接引用 javax.faces.component.html 包内的 HTML 组件。例如，在你的组件类中创建一个 HtmlCommandButton 的实例是不可取的，你应该考虑用 javax.faces.component 包中的 UICommand 。另一方面，如果你希望你的模型类可以重用于不同的 Web 框架，那么你的模型类就不应该依赖于 JSF 的任何包，即模型类只表示业务对象而不包含任何用户界面相关的组件、数据和状态。

　　基于这些原则，对比传统方式和本文介绍的技巧，我们可以发现基于重用的开发策略会极大简化 JSF 自定义复合组件的编写。开发 JSF 自定义组件通常需要如下 3 个步骤(参考“怀疑论者的 JSF: JSF 组件开发”)。

　　1.扩展 UIComponent

　　·传统方式：创建一个类，扩展 UIComponent，保存组件状态，在 faces-config.xml 中注册组件

　　重用技巧：

　　·选择 UIPanel 作为布局容器，重用标准组件作为复合组件的子组件。

　　·实现内部动作监听器。

　　2.定义渲染器或者内联实现它

　　传统方式：覆盖实现 encode/decode，在 faces-config.xml 中注册渲染器。

　　重用技巧：重用标准渲染器类型。

　　3.创建自定义标签，继承 UIComponentTag

　　传统方式：返回渲染器类型和组件类型，设置 JSF 表达式属性

　　重用技巧：传递属性值给作为子组件的标准组件。示例概述

　　我们通过一个自定义复合组件 Value Scroller 的开发步骤说明如何运用多种技巧重用标准组件的功能和实现，达到简化开发易于重用的目的。 Value Scroller 可以让你通过点击增值或减值按钮来输入数值，而不用手工键入，如图 1 所示。这个示例只包含最基本的功能，如只支持整型数值输入，但对于本文要介绍的内容已经足够了。

　　图 1. 测试页面中的 Value Scroller　

　　图 2 说明了 Value Scroller 的基本类结构，遵循 MVC 模式。组件类 ValueScroller 扩展了 UIPanel，作为控制器(Controller)负责与用户的交互。标签类 ValueScrollerTag 继承了 UIComponentTag，作为视图(View)处理页面显示。与 Value Scroller 绑定的值对象作为模型(Model)存储用户键入的数值。

　　图 2. Value Scroller 的类结构　　

　　在后面章节中，本文将结合 Value Scroller 示例说明如何应用前面提到的原则和技巧快速开发 JSF 自定义复合组件。　选择 UIPanel 作为容器

　　创建 JSF 自定义复合组件的第一步就是要选择一个标准组件类进行扩展。通常我们会考虑将这个组件类作为容器，在其中嵌入子组件，从而构成复合组件。这里选择继承 UIPanel 作为 Value Scroller 的容器，以 Grid 的方式渲染生成页面，并且其中包含一个 UIInput 和两个 UICommand，分别作为数值输入框和加减值按钮，如清单 1 所示：

　　清单 1. 扩展类 UIPanel　　

public class ValueScroller extends UIPanel {

　　/**

　　* The default constructor

　　*

　　*/

　　public ValueScroller() {

　　super();

　　addChildrenAndFaces();

　　}

　　}

　　作为 Value Scroller 子组件的那些标准组件将在 addChildrenAndFaces 方法中加入布局容器之中。重用标准渲染器类型

　　接着，我们开始创建 Value Scroller 的子组件，并且实现渲染器的功能。按照传统方式，必须覆盖 UIComponent 的 encodeBegin() 和 decode() 方法，但是，如果我们开发的复合组件只是由多个标准组件构成，我们完全可以将不依赖于特定标记语言的标准组件基类加入到自定义组件中，并且为每个标准组件设定一个标准的渲染器类型，就可以完成复合组件要实现的渲染器功能。重用标准组件渲染器类型好处在于两方面：减少开发的工作量和可能出错的机会，对于 JSF 初学者尤为重要;不用实现与特定标记语言相关的 encode/decode 逻辑，使组件类更易于重用。

　　“JavaServer Faces 实战” 这本书列出了 JSF 规范提供的标准渲染器类型。

　　表 1. JSF 标准渲染器　

　　从表 1 可以看出，一个组件基类通常对应于多个渲染器类型(如果使用 HTML 作为标记语言，即对应于多个 HTML 元素)，因为组件基类只定义了通用的数据和行为。比如说，UICommand 有两个 HTML 子类 HtmlCommandButton 和 HtmlCommandLink，分别对应于渲染器类型 javax.faces.Link 和 javax.faces.Button 。当我们想在一个复合组件内部包含一个链接时，只需要创建一个 UICommand 实例，并将其渲染器类型设置为 javax.faces.Link，而不用从头覆盖实现 encodeBegin() 和 decode() 方法。清单 2 列出了 Value Scroller 中的子组件如何在组件类 ValueScroller 中被创建，以及渲染器等属性如何被设定。

　　清单 2. 重用标准渲染器创建自定义复合组件　　

private static final String PANEL_GRID_RENDERER = "javax.faces.Grid";

　　private static final String INPUT_TEXT_RENDERER = "javax.faces.Text";

　　private static final String COMMAND_LINK_RENDERER = "javax.faces.Link";

　　private static final String GRAPHIC_IMAGE_RENDERER = "javax.faces.Image";

　　/**

　　* Add children to the base container

　　*

　　*/

　　private void addChildrenAndFaces() {

　　// Set attributes of the base container

　　this.setRendererType(PANEL_GRID_RENDERER);

　　this.getAttributes().put(COLUMNS_ATTRIBUTE, new Integer(2));

　　// Add the input component

　　input = new UIInput();

　　input.setId(INPUT_ID);

　　input.setRendererType(INPUT_TEXT_RENDERER);

　　this.getChildren().add(input);

　　// Add the container of the up and down links

　　UIPanel linkContainer = new UIPanel();

　　linkContainer.setId(LINKPANEL_ID);

　　linkContainer.setRendererType(PANEL_GRID_RENDERER);

　　linkContainer.getAttributes().put(COLUMNS_ATTRIBUTE, new Integer(1));

　　ScrollerActionListener listener = new ScrollerActionListener();

　　// Add the up link

　　UICommand upLink = new UICommand();

　　upLink.setId(UPLINK_ID);

　　upLink.setRendererType(COMMAND_LINK_RENDERER);

　　upLink.addActionListener(listener);

　　UIGraphic upImage = new UIGraphic();

　　upImage.setId(UPIMAGE_ID);

　　upImage.setRendererType(GRAPHIC_IMAGE_RENDERER);

　　upImage.setUrl(UPIMAGE_URL);

　　upLink.getChildren().add(upImage);

　　linkContainer.getChildren().add(upLink);

　　// Add the down link

　　UICommand downLink = new UICommand();

　　downLink.setId(DOWNLINK_ID);

　　downLink.setRendererType(COMMAND_LINK_RENDERER);

　　downLink.addActionListener(listener);

　　UIGraphic downImage = new UIGraphic();

　　downImage.setId(DOWNIMAGE_ID);

　　downImage.setRendererType(GRAPHIC_IMAGE_RENDERER);

　　downImage.setUrl(DOWNIMAGE_URL);

　　downLink.getChildren().add(downImage);

　　linkContainer.getChildren().add(downLink);

　　this.getChildren().add(linkContainer);

　　}

将属性值传递给标准组件

　　我们先看一下标签描述文件(TLD)中定义的 Value Scroller 提供的属性。

　　清单 3. 在 TLD 中定义自定义复合组件的属性　　

<tag>
<name>valueScrollername>
<tag-class>component.taglib.ValueScrollerTagtag-class>
<body-content>JSPbody-content>
<attribute>
<name>idname>
<description>ValueScroller IDdescription>
attribute>
<attribute>
<name>valuename>
<description>ValueScroller valuedescription>
attribute>
<attribute>
<name>sizename>
<description>Input field sizedescription>
attribute>
<attribute>
<name>minname>
<description>Minimum valuedescription>
attribute>
<attribute>
<name>maxname>
<description>Maximum valuedescription>
attribute>
<attribute>
<name>stepname>
<description>Scrolling stepdescription>
attribute>
tag>

　　我们看到，除了 min/max/step 是自定义的属性之外，其他的都属于 JSF 标准组件的属性，可以直接传递给构成 Value Scroller 的标准组件处理，完全不用为这些标准组件的属性覆盖实现方法 saveState() 和 restoreState() 。

　　通常有两种方法传递属性值。当你需要对属性进行一些额外的操作(如验证或者转换等)，可以在标签类 ValueScrollerTag 中将属性传递给自定义组件类，如下所示：

　　清单 4. 传递自定义属性　　

/**
* Override the setProperties method
*/
protected void setProperties(UIComponent component) {
super.setProperties(component);

ValueScroller vs = (ValueScroller)component;

Application app = FacesContext.getCurrentInstance().getApplication();
// Set value attribute
if (value != null) {
if (isValueReference((String)value)) {
ValueBinding vb = app.createValueBinding((String)value);
vs.setValueBinding("value", vb);
} else {
throw new IllegalArgumentException("The value property must be a value " +
"binding expression that points to a bean property.");
}
}

// Set id attribute
if (id != null) {
vs.setId((String)id);
}

// Set other attributes
vs.setMin(min);
vs.setMax(max);
vs.setStep(step);

}

　　另外一种方法就是在标签类 ValueScrollerTag 中直接把属性值加入相应标准组件的属性 Map 。例如，将 size 属性传递给自定义复合组件包含的 UIInput：

　　清单 5. 传递标准属性

　　vs.findComponent("input").getAttributes().put("size", new Integer(size));实现内部动作监听器

　　在 Value Scroller 中，点击增值或减值按钮，输入框内的值会随之增大或者减小。我们可以简单地在组件类 ValueScroller 中实现一个内部动作监听器，重用 UICommand 的事件处理逻辑。

　　清单 6. 实现 Value Scroller 动作监听器　　

/**
* Internal action listener for Value Scroller
* _cnnew1@author cll
*
*/
private class ScrollerActionListener implements ActionListener {
public void processAction(ActionEvent e) {
// Only Integer is supported for this demo
if (input.getValue() instanceof Integer) {
String commandId = ((UICommand)e.getSource()).getId();
int value = ((Integer)input.getValue()).intValue();
// Increase value if the up link is clicked
if (commandId.equals(UPLINK_ID)) {
if (value + getStep() > max) {
input.setValue(new Integer(max));
} else {
input.setValue(new Integer(value + getStep()));
}
}
// Decrease value if the down link is clicked
else if (commandId.equals(DOWNLINK_ID)) {
if (value - getStep() < min) {
input.setValue(new Integer(min));
} else {
input.setValue(new Integer(value - getStep()));
}
}
} else {
throw new IllegalArgumentException(
"Unsupported binding type, " +
"and only Integer instance allowed for this demo.");
}
}
}

　　最后，在调用 addChildrenAndFaces 方法创建添加子组件的时候，将这个自定义动作监听器添加到增值和减值组件中去。

　　清单 7. 注册 Value Scroller 动作监听器　　

ScrollerActionListener listener = new ScrollerActionListener();

　　upLink.addActionListener(listener);

　　downLink.addActionListener(listener);

　　使用 Value Scroller

　　Value Scroller 的开发已经完成，使用也非常简单，首先在 faces-config.xml 中声明引用 Value Scroller，如下所示：

　　清单 8. 在 faces-config.xml 中声明引用 Value Scroller　　

<component>
<component-type>xyz.ValueScrollercomponent-type>
<component-class>
component.ValueScroller
component-class>
component>

　　然后，在测试 JSP 页面 Test.jsp 上包含 Value Scroller 的标签描述文件。

　　清单 9. 在 JSP 中包含 Value Scroller 的 TLD　　

<%@ taglib uri="/WEB-INF/lib/ValueScroller.tld" prefix="xyz"%>

　　最后，在 Test.jsp 页面上使用 Value Scroller 的标签，并且指定 size/min/max/step 属性值，部署运行，就可以看到图 1 所示的结果了。

　　清单 10. 在 JSP 中创建 Value Scroller 并设置属性　　

<xyz:valueScroller value="#{pc_Test.itemCount}" size="5" min="-50" max="10000" step="2">
xyz:valueScroller>

　　结束语

　　我们可以看到，本文介绍的自定义复合组件 Value Scroller 的实现没有编写 encode/decode 和 state/event 管理相关的逻辑，简单、快速、并且易于重用。本文总结的 JSF 自定义复合组件的开发技巧在很大程度上降低了复杂度和工作量，优于传统的开发方式。

作者：IBM 陈荔龙 Ealine Zhan 齐克科

digu and adobe online

2009-06-04T09:18:00.001+08:00

今晚无聊，发现2个好玩的小游戏。。。这里和大家分享下。。

邀请朋友－嘀咕网

digu.com/jump?aid=invite_notMatchListContacts&m...

2009年6月3日

09-6-3

Untitled -- Acrobat.com Labs

labs1.acrobat.com/#d=MCLsq2PSw-dKANt9HusbfA

感受JS的魅力——网页版超级玛丽

2009-06-03T17:12:00.000+08:00

新闻来源:
说起超级玛丽，相信很多人都不会不知道吧。作为童年时代的美好回忆，你也是不是想再一次重温呢？哈哈，这次不用再玩红白机了，来个更猛的。今天介绍的超级玛丽使用JavaScript写的网页游戏，没错，是JavaScript，在这里就不多说了，直接附上地址，大家去玩吧。

相信大家不会不知道超级玛丽的玩法吧？记住这个网页版的按“回车”键开始游戏，“左右键”控制前后方向， A 射击， S 跳。

JavaScript版超级玛丽

繠蝶冰緣

CSS hack 初学小结

firefox, IE, safari, chrome, opare用之初体验

CSS半透明度设置,兼容Firefox, IE, Chrome, Opera and Safari

简述JSF测试框架

Jquery Tools——不可错过的Jquery UI库

javascript实用技巧--数组.

初体验Google Chrome 2——优点和失望之处

关键词：Google | 感谢ydj9931的提供

实例讲解css中的行为：expression和behavior(附DEMO下载)

结构、表现、行为，分离和联系

表现和行为的联系

见鬼！又变了！

CSS中的behavior行为

expression和behavior的重要说明

1：只有IE才可以使用

2：不推荐使用expression和behavior

3：expression和behavior的现实意义

目标:安全纯净互联网 软件升级报38期

Web自动化测试工具Selenium 1.0正式发布:Chrome支持+用户指南

JavaScript大牛：Douglas Crockford

廉价货币 昂贵楼市

10个jquery动画菜单：插件和教程

插件

LavaLamp

jquery Kwicks 插件

仿Mac的停靠菜单插件

jquery滑动菜单

教程

CSS Sprites2 – 使用jquery制作动画菜单

使用jQuery的动画菜单

使用CSS和jquery创建很酷的动画导航菜单

CSS Dock Menu

使用jquery制作平滑的动画导航

使用jquery实现动画背景图片

提高网站可用性的十个实用小技巧

2009-06-11 15:17 作者：oncoding 出处：天极网 责任编辑：盛晓莹

十分钟学会Java RMI

jQuery实现的快速查找

By : 愚人码头 | In : 前端框架

JavaScript 原型链

Google Wave的架构

Google Wave将基于BSD协议开源

JSF自定义复合组件的技巧和窍门

digu and adobe online

感受JS的魅力——网页版超级玛丽

目标:安全纯净互联网软件升级报38期

廉价货币昂贵楼市

2009-06-11 15:17 作者：oncoding 出处：天极网责任编辑：盛晓莹