QWrap Selector的几个应用场景

除了如jquery的$(selector)之外，Selector在js中有很多使用场景。
以QWrap的Youa版应用(js/apps/core_dom_youa.js）为例，主要用法有以下。

W(selector)  相当于jquery用户使用的$
如:
W(‘input.aaa’).css(‘color’,’red’).val(‘’);
W(‘#myid > div’). css(‘color’,’red’);

W.one(selector) 得到某个满足条件的元素的W包装
如：
W.one(‘input.aaa’).css(‘color’,’red’).val(‘’);

W.prototype.query(selector)
W.prototype.one(selector)
如：
W(‘#id’).show().query(‘>*’).show().query(‘>*’).css(‘color’,’red’);
 //show #id ; 再show其儿子 ; 再为其孙子设color
W(‘#id’).show().query(‘~div’).hide()
 //show #id ; 再hide其所有的div弟弟
W(‘#id’).show().one(‘>div’).show().one(‘>a’).css(‘color’,’red’);
 //show #id ; 再show其第一个div儿子 ; 再为这个儿子的第一个a儿子设color

W.prototype.关系系列
previousSibling(selector)
nextSibling(selector)
ancestorNode(selector)
firstChild(selector)
lastChild(selector)
用法如：
W(‘#id’). previousSibling (‘div,aaa’).hide()
 //show #id ; 再hide其最小的div.aaa兄长
W(‘#id’). ancestorNode (‘div.aaa’).hide()
 //show #id ; 再hide其最近的div.aaa祖先
W(‘#id’). lastChild (‘div.aaa’).hide()
 //show #id ; 再hide其最小的div.aaa儿子

W.prototype.代理系列
delegate(selector,eventName,handle)
undelegate(selector,eventName,handle)
用法如：
W(‘#id’). delegate (‘>div’,’click’,function(){})
 //在#id上添加事件委托，对其div儿子有效。
W(‘#id’). delegate (‘a’,’click’,handle1)
 //在#id上添加事件委托，对其a子孙节点有效。
W(‘#id’). undelegate (‘a’,’click’, handle1)
 //在#id上解除事件委托，对其a子孙节点有效。

Selector的用处远不只以上，还有很多的挖掘空间。无法一一列出，当然，还有很多我所没想到的……

补充说明：以上用法只是QWrap的有啊版用法，并不一定是JQuery也支持的，请勿混淆。
另外，值得一提的是，QWrap的Jss，也是借用selector的概念，将js数据与html元素建立联系。

附：QWrap：https://github.com/wedteam/qwrap



另，以下这段本来是回复gongji同学“无从选择选择器”的感叹的，也抽取到本文来了。
@gongji
选择器并不直接面向页面编码同学，而是面向框架。
选择使用哪一个选择器，是写js框架的同学的任务。
选择器可能会提供一些理论上会用到的一些方法， 但是缺乏易用性。
js框架会提供给用户一些简单易用的方法，至于它里面怎么使用选择器，同学们一般不必关心。
例如：
Sizzle('div')返回的是一个array。这个方法我们不会直接用到。而我们经常用的$('div')返回的是一个jquery对象。
通常，我们只需要明白框架里哪些参数可以是cssselector字符串。
本篇原文的目的，是想列出selector在QWrap里的一些应用场景。
对于QWrap用户，了解后以便更简写码。
对于Jquery用户，可以参考下写法有什么不同。
对于Selector提供者，可以交流下Selector的使用场景以互相参考。
对于写JS框架的同学，也可以当作交流。