YUI-Dom Collection

The Dom Collection comprises a family of convenience methods that simplify common DOM-scripting tasks, including element positing and css style management, while normalizing for cross-browser inconsistencies.
文档对象模型集合由一系列简化DOM任务的方法组成, 这些方法可以操纵元素位置以及CSS样式.

Getting Started

包含脚本源文件在页面中即可:
<!-- Dependencies -->
<script src="yahoo.js"></script>

<!-- Source file -->
<script src="dom.js"></script>

Using the DOM Collection

DOM Collection的常见用途: 调整HTML元素位置, 获取设置样式, 获得视点大小, 管理类名字

Positioning HTML Elements:
由于不知道元素是如何在文档中定位的,所以要得到其目前的坐标比较难. DOM Collection的定位方法setXY(),getXY()等能够确保获得准确的位置. 页面坐标是定义在HTML文档环境中的,包括浏览器边框的一部分.

Getting and Setting Styles:
getStyle方法可以获得元素的 style object. setStyle方法可以设置元素的style. 在CSS中, 透明度(opacity)的实现取决于浏览器. setStyle和getStyle统一了透明度在所有浏览器中的实现.

Getting the Veiwport Size:
可视范围是文档目前可以被看见的高度和宽度, 这个不考虑文档的绝对高度和宽度. 获得文档的可视范围比较有难度, 因为这取决于浏览器以及渲染模式. getViewportWidth 和getViewportHeight方法能够获得准确的可视范围测量值.

Managing Class Names:
Dom Collection提供了许多动态管理类名的方法.包括:  getElementsByClassName(className,tagName,rootNode)获得具有有一个类名的所有元素,可以设定其范围; hasClass(element, className)检测元素是否有相应的类名;addClass(elemtn, className)添加一个样式名到元素上; replaceClass(element, oldClassName, newClassName)替换样式名字.