了解YUI【二】(转)
YUI之Node
? ?Node是用来操作DOM node的工具，实际上每一个Node实例都代表着一个DOM node，每一个NodeList都代表着一组DOM node.
?
1.先引入YUI3的种子文件：
<script src=" http://yui.yahooapis.com/3.0.0/build/yui/yui-min.js"> </script>?
?再加载相应模块：
YUI().use('node', function(Y) { ??
});?
2. 获得Node
? ?可以使用YUI.one()获取Node，该方法的参数可以是一个Node，也可以是一个选择器（selector),在使用选择器时，返回首个匹配元素。默认情况下css3选择器不被支持，如果要使用，需要加载“selector-css3”模块。
YUI().use('node', function(Y) { ??
?var node1 = Y.one('#main'); ??
?var node2 = Y.one(document.body); ??
}); ?
3. 访问Node属性
? ?可以使用Node的set，get方法访问Node的属性，需要注意的是如果返回节点的话返回的是YUI Node而不是DOM node，这一点在其他地方也要注意。
YUI().use('node', function(Y) { ??
var node = Y.one('#foo'); ??
var parent = node.get('parentNode'); // Node instance ??
var html = 'I am "' + node.get('id') + '".'; ??
html += 'My parent is "' + parent.get('id') + '"'; ??
?node.set('innerHTML', html); ??
}); ?
4. 事件监听
可以用on方法添加事件监听器：
YUI().use('node', function(Y) { ??
Y.one('#demo').on('click', function(e) { ??
?e.preventDefault(); ??
?alert('event: ' + e.type + ' target: ' + e.target.get('tagName')); ? ?
? }); ??
}); ?
5. DOM方法
? Y.Node提供了所有DOM node的原有方法
?
6. NodeList的使用
? NodeList提供了与Node相似的API，但是它的处理时对所有NodeList中的所有Node作用的。
? 例如如下代码对demo的所有子元素添加'bar'类：?
?YUI().use('node', function(Y) { ??
? Y.one('#demo').get('children').addClass('bar'); ??
}); ?
7. 查找
? Node提供one，all，test方法实现查找第一个匹配元素，查找所有匹配元素，测试是否存在匹配元素的功能
?
转自：http://blog.sina.com.cn/s/blog_632d19d50100rztu.html
