首先,记下YUI的基本类:YAHOO.util.Dom
一.定位元素
var pos = YAHOO.util.Dom.getXY("id1"); YAHOO.util.Dom.setXY("id2",pos);
同理还有setX,setY等方法。
二.设置样式
YAHOO.util.Dom.setStyle(["id1","id2"],"opacity","0.5"); YAHOO.util.Dom.getStyle("id2","opacity")';
第一行为设置id1和id2两个元素的透明度为0.5;第二行为取得id2元素的透明值。
注:OPERA 9一下版本不支持opacity透明;
另外,本例也演示了如何在一个请求中调用多个元素,即使用[“element1”,“element2”]
的方式。
三.获取视窗大小
var viewport = [ YAHOO.util.Dom.getViewportWidth(); YAHOO.util.Dom.setViewportHeight(); ]
获取当前可见尺寸的大小,而非绝对物理大小
四.管理样式
YUI有多种样式管理方式。
-
getElementsByClassName(className, tagName, rootNode)
- 获取具有指定样式名的元素——结果为 数组。可以通过指定根节点(父节点)名称来缩小检索范围 hasClass(element,className);
- 判断元素是否具有样式,返回的是 布尔值true或false addClass(element,className);
- 增加样式; removeClass(element,className);
- 移除已有样式; replaceClass(element,oldClassName,newClassName)
- 替换旧的样式为新的;
例子:var element = YAHOO.util.Dom.getElementsByClassName(”red”,”div”)
即为获取class=”red”的DIV的集合。
另外,YUI里获取一个元素的class名的函数是YAHOO.util.Dom.get(”id”).className。
找到篇网上的同类文章:《翻译:YUI DOM集合》