2009.1105
动态加载JavaScript的小实践

动态加载JavaScript文件和CSS资源为Web前端开发提供了巨大的灵活性,同时也实现了lazy load和按需加载,相比XMLHttpRequest而言其没有跨域的限制使其广泛应用。其基本原理是:在页面DOMReady后,利用JavaScript把指定文件路径的script和link元素插入到页面中,然后判断其加载状态再进行继续操作。

阅读全文 »

标签:, ,
在0:56发表于Javascript & DOM & AJAX,有评论10
2009.0906
CSS实现HTML元素透明的那些事

CSS3草案中定义了{opacity: | inherit;}来声明元素的透明度,这已经得到了大多数现代浏览器的支持,而IE则很早通过特定的私有属性filter来实现的,所以HTML元素的透明效果已经无处不在了。首先看看A级浏览器所支持的用CSS实现元素透明的方案

阅读全文 »

标签:, , , , , , , ,
在23:44发表于HTML & CSS, Javascript & DOM & AJAX,有评论29
2008.1230
如何开始使用YUI Doc工具?

YUI Team实践出了一个高效易协作的前端代码开发流程:代码首先由Ant来组织管理和版本化、接着由JsLint来验证,然后由YUI Doc文档化、最后由YUI Compressor进行压缩发布。上个月初,YUI Team公布了这个新的JavaScript API文档生成工具YUI Doc,它本来专门为YUI提供API级别的文档的,现在它开源为人民服务了。

YUI Doc和JavaDoc、JSDoc和JsDoc Toolkit相似。YUI Doc是由注解驱动(comment-driven )的系统,它通过解析代码中描述结构的注解来生成文档。由于它纯粹的依赖于注解,所以并不像一些模拟系统一样需要有惯用语和代码模式。更详细的介绍可以看YUI Doc的官方文档和YUI blog上的《YUI Doc: A New Tool for Generating JavaScript API Documentation》(由于YUI blog咱们无法访问,比较好的解决方案就是在Google Reader中订阅它的Feed,直接输入 http://yuiblog.com即可。)

YUI Doc是基于Python开发,且依赖几个扩展库,加之其Getting Started写的也比较含糊,所以如何使用这个工具反而成为第一道门槛,尤其对于那些对Python不熟悉的同学来说。所以,下面的重点是介绍如何在Windows上使用YUI Doc: 阅读全文 »

标签:,
在0:42发表于Javascript & DOM & AJAX,有评论14
2008.0428
第二届D2见闻和随想

这个周末回京参加了期待已久的第二届D2前端技术论坛,见到众多的前端同行,更聆听了几场高质量的讲演,收获良多。讲演的资料整理后会在第二届D2前端技术论坛的官网上提供下载,同时也会提供会议视频,强烈推荐前端工程师关注。

  1. 周爱民的讲演“前端设计与开发的基本模式”,看起来很丰富,很多模式或理念听起来也蛮有争议,避免不了空和虚,但我不能不承认他提供了很多我有兴趣但尚未涉及东西,这些给了我新的视角。
  2. 黄继佳的讲演“Silverlight应用”,虽然很高兴他能来参加和支持D2,幻灯片也很cool,但我强烈的感觉这是一个很纯正的Silverlight的产品推广,我不是太喜欢。
  3. Hedger Wang的讲演“Enterprise Ajax in PHP”,是这次D2的精华。他提出管理Ajax在企业级应用的设计模式,很多正是我日常开发中遇到,比如他讲到的映射,我也曾经做过类似的解决方案,比如他讲到的对多次同一请求的管理,我也曾思考过,但那往往是一个个独立的小点,这次讲演终于让我有了从点到线到面的感觉。他的讲演也准备的相当好,既有总结,又有代码,同时利用生活中的例子来说明原理,想听不明白都不行。我不需要如何得称赞hedger的讲演,如果你的开发涉及到Ajax,那么你就应该去看看他的讲演。ps,祝他杭州玩的开心。
  4. Nate Koechly的讲演“Enhanceing Web Sites With The YUI Library”(English)”,作为YUI开发的核心成员,这次讲演虽然有点推广YUI的意味(在此有近一年应用YUI经验的我也强烈推荐YUI),但是仅仅从他幻灯片上就可以看出他事先的准备和用心,甚至他表达出了要学习汉语的意愿。但很遗憾的是,由于语言的原因,这次没有能充分的从Nate身上获取更多的更深的东西,虽然有hedger义务做翻译,虽然对nate的提问是最多的。
  5. 章亦春的讲演“Nifty web apps on an OpenResty”,讲的很有激情,也给出了一个新的Web OS,作为一个视角是一个很棒的东西,但是作为我个人来讲我并不赞同这个思路,我一直认为让一门语言处于它最适当的位置才是王道,就像语义化设计一样,应该用合适的标签来组织合适的数据。虽然章亦春提到了不应该对Javascript滥用,但是很遗憾的是我感觉这就是一种滥用。
  6. 案例分享阶段,贤安的“如何写一个富文本编辑器”,小马的“前端开发工具介绍”,一位仁兄(不好意思,记不起来名字)的“用Adobe Air开发IM”,都很有意思,这些很务实的小分享越多越好,因为每个人的心得体会小窍门汇聚在一起就有了越来越顺畅的前端开发。

阅读全文 »

标签:, , ,
在2:09发表于web2.0 & so on,有评论31
2008.0417
Firefox的默认样式表

每个浏览器都有自己的默认样式,这是一段预定义的CSS,用以简单地呈现网页。在Firefox中的地址栏中输入resource://gre/res/html.css即可以看到该浏览器的默认样式。在Firebug 1.2 Alphas的styles中就可以看到默认样式对页面定义样式的影响。毫无疑问,理解和学习浏览器的默认样式能更好的理解浏览器对解析样式和呈现页面。Firefox3和Firefox2相比,默认样式仅有8处不同,但这些改变也可以让我们感觉到Firefox3在样式上的改进: 阅读全文 »

标签:, ,
在0:31发表于HTML & CSS,有评论1
2008.0326
扩展YUI Loader

YUI Loader是YUI的动态载入外部Javascript和CSS文件的整体解决方案。它的可靠、安全、高效,优化了页面的呈现速度,实现了外部Js和CSS的按需加载。

在YUI 2.4.0到2.5.1版本中,YUI Loader通过其addModule()方法只能配置一个YUI Loader实例的加载模块信息,无法配置全局的加载模块信息。实际中,能够全局的配置加载文件的模块信息对于统一维护非常的重要,特别是在静态文件服务器设置了上传文件不可以修改和删除情况下。下面是解决这个问题的两个方法: 阅读全文 »

标签:, , ,
在23:45发表于Javascript & DOM & AJAX,有评论6
2007.1204
Javascript的一种模块模式

全局变量是魔鬼。在YUI中,我们仅用两个全局变量:YAHOO和YAHOO_config。YUI的一切都是使用YAHOO对象级的成员或这个成员作用域内的变量。我们建议在你的应用程序也使用类似的规则。

Douglas Crockford已经传授了一个有用的单例模式(singleton pattern)实现此规则,我认为他的模式有益于你基于YUI的那些应用。Douglas叫它模块模式(module pattern)。它是如下工作的: 阅读全文 »

标签:, , ,
在0:49发表于Javascript & DOM & AJAX,有评论15

回到页眉