由于无法通过标准DOM方法（尤其是html_element.getAttribute（'key'）;）无法获得一致，准确的结果而感到沮丧之后；和html_element.setAttribute（'key'，'value'）;遇到了一些YUI库组件，这些组件为各种DOM方法提供了抽象。
本文中涉及的一些有趣的与DOM相关的工具是YAHOO.util.Element，YAHOO.util.DOM和YAHOO.util.Selector。
YAHOO.util.Dom
YAHOO.util.Element基本上是一个单例实例，提供了各种DOM方法。以下是一些可能有用的方法。有关更多信息，请参阅API文档。
通过ID查找元素
要通过其ID（而不是document.getElementById）查找元素，另一种通过YUI的方法是通过YAHOO.util.Dom.get。
var element = YAHOO.util.Dom.get('some_element');Element(s)按类别名称查找
要按类名称查找元素，
var elements = YAHOO.util.Dom.getElementsByClassName('some_class');YAHOO.util.Element
在我发现jQuery多么强大之前，我在各种任务中都非常依赖YAHOO.util.Element。基本上，YAHOO.util.Element包装HTMLElement并提供一些方法来简化某些DOM操作中使用的代码，例如获取和设置属性，操纵元素位置等。详细的API文档在此处。
创建一个新元素
要创建一个新元素，通常将结果从document.createElement以下方法传递到构造函数中。例如，创建一个新的链接元素。
// 创建一个新元素
var element = new YAHOO.util.Element(document.createElement('a'));
// 设置href
element.set('href', 'http://www.google.com/');
// 插入标题
element.appendChild(document.createTextNode(
'Click me to the search engine.'
));
element.appendTo(document.body);使用现有元素
要将YUI元素组件方法包装到现有HTMLElement上，请将元素OR元素Id传递到构造函数中。
var by_element = new YAHOO.util.Element(
YAHOO.util.Dom.get('some_id')
);
var by_id = new YAHOO.util.Element('some_id');获取原始的HTMLElement
迟早会发现，无法通过YAHOO.util.Element实例调用某些DOM方法，例如setAttribute方法。除此之外，从2.6.0版本开始，appendChild方法似乎也不接受YAHOO.util.Element中的实例。因此，要获取包装的元素，
var some_container = new YAHOO.util.Element(container_element);
var the_yui_element = new YAHOO.util.Element(original_element);
// 这将导致错误
some_container.appendChild(the_yui_element);
// 但这不会
some_container.appendChild(the_yui_element.get('element'));希望在将来的发行版中，所有需要HTML元素的方法也可以接受YAHOO.util.Element的实例。
YAHOO.util.Selector
通过CSS3选择器进行DOM收集
那些来自jQuery的人可能对知道YUI还可以通过YAHOO.util.Selector提供类似的功能感兴趣。对于那些感兴趣的人，这里是API文档。举个例子，
var elements = YAHOO.util.Selector.query('body p');对于感兴趣的人，官方网站提供了大量信息，指南，示例和教程。但是，对于那些不熟悉javascript的人，这些教程可能需要一些时间才能习惯。但是，在投入足够的时间后，大量的API文档将非常有用。我将记录有关YAHOO.util.Event的一些注释，这是下一次我最喜欢的组件。