YUI 3 学习笔记:dom
YUI Dom 模块的层次结构很清楚:

展开的详细图:yui-dom-full.png
一点心得
- 很清晰的 submodules 组织方式,各个子模块分工明确,源码明朗如皓月,看得心里很晴天。
- selector-css3 采用的是 plugin 方式,在 selector-css2 里预留了扩展接口,css3 里直接扩充伪类和操作符。这种可扩展写法在细节代码里也被多次用到,比如针对 IE 的某些兼容代码的写法。代码独立,可增可砍,很 cute.
- 小颗粒的灵活也是有代价的。各个 submodules 之间,有些许重复代码。值还是不值,很难评说。
- 三元运算符是个好东西:
getText: (document.documentElement.textContent !== undefined) ? function(element) { var ret = ''; if (element) { ret = element.textContent; } return ret || ''; } : function(element) { var ret = ''; if (element) { ret = element.innerText; } return ret || ''; }在不同的浏览器下,getText 指向不同的函数,而且三元运算符中的判断只需执行一次。
类似还有一种写法:_childrenByTag: function() { if (document[DOCUMENT_ELEMENT].children) { return function(element, tag, fn, toArray) { ... }; } else { return function(element, tag, fn) { ... }; } }()返回函数的函数挺好用。
- 看源码前,会尝试回答一个问题:如何我来设计 DOM 的 API, 会画出怎样一副图来?最后将自己设计的 API 和 YUI3 的对照,我的设计里,功能比较全,但层次分类和清晰度上,YUI3 的明显好很多。从总体上比较和学习 API 的设计,别有一番迷人的天地。
- 这次看代码,没怎么深究到代码细节。一直提醒自己从大局上去看。舍得舍得,有所舍才有所得,的确如此。

July 6th, 2009 on 16:02
被玉伯“诱惑”了,有事没事也学习学习YUI3.
July 7th, 2009 on 12:59
也开始研究YUI了,还能顺便学习英语。
July 8th, 2009 on 15:32
getText: (function(){
var _get = document.documentElement.textContent !== undefined ? “textContent” : “innerText”;
return function(element){
var ret = ”;
if (element) {
ret = element[_get];
}
return ret || ”;
};
})()
这样更省代码
July 9th, 2009 on 12:19
三元那个东西我第一次看到就是在ext库里面,javascript真得很神奇,哈哈
leave a reply