selectors.md.svn-base

自己找的mootools中文文档

Native: Element {#Element}
==========================
CSS选择器功能模块, 加入该模块后Element中原有的一些方法将获得功能加强.

Element 方法: getElements {#Element:getElements}
----------------------------------------------------

根据CSS选择器来获取子元素

### 语法:

	var myElements = myElement.getElements(selector);

### 参数:

1. selector - (*string*) CSS选择器

### 返回值:

* (*array*) [Element][]集合

### 示例:

    //返回所有myElement下的超链接
	$('myElement').getElements('a'); 
	
    //返回所有myElement下的name为"dialog"的input元素
	$('myElement').getElements('input[name=dialog]');

    //返回所有myElement下的name以'log'结尾的input元素
	$('myElement').getElements('input[name$=log]');
	
	//返回所有myElement下的邮件链接(href以"mailto:"开头)
	$('myElement').getElements('a[href^=mailto:]');

    //为页面中所有class为email的超链接添加事件
	$(document.body).getElements('a.email').addEvents({
		'mouseenter': function(){
			this.href = '[e-mail]';
		},
		'mouseleave': function(){
			this.href = '#';
		}
	});

### 备注:

- 在选择器属性中支持的操作符:

	- =  : 等于
	- ^= : 开始于
	- $= : 结束于
	- != : 不等于

Element 方法: getElement {#Element:getElement}
--------------------------------------------------

和[Element:getElements](#Element:getElements)类似, 但只返回第一个元素


###	语法:

	var anElement = myElement.getElement(selector);

###	参数:

1. selector - (*string*) CSS选择器

###	返回值:

* (*mixed*) 如果找到匹配的元素则返回该元素,否则返回null

### 示例:

	var found = $('myElement').getElement('.findMe').setStyle('color', '#f00');

### 备注:

- 可选的语法是[$E](#Element:E)


函数: $E {#Element:E}
--------------------------

[Element:getElement](#Element:getElement)的别名函数,以document为元素搜索上下文


Element 方法: match {#Element:match}
--------------------------------------

检测元素是否匹配给出的选择器

### 语法:

	var matched = myElement.match(selector);

###	参数:

1. selector - (*string*) CSS选择器

### 返回值:

* (*boolean*) 如果匹配则返回true, 否则返回false

### 示例:

    //如果myElement是一个name属性为"somename"的div元素, 则返回true
	$('myElement').match('div[name=somename]');



### 另参考:

[$]: /Element/Element#dollar
[Element]: /Element/Element

Selectors.Pseudo {#Selectors}
=============================

[Selectors][]的伪类选择器

### 另参考:

- [W3C Pseudo Classes](http://www.w3.org/TR/2005/WD-css3-selectors-20051215/#pseudo-classes)


选择器: enabled {#Selectors:enabled}
-------------------------------------------------

匹配所有enabled的元素

### 用法:

	':enabled'

### 示例s:

	$$('*:enabled')

	$('myElement').getElements(':enabled');

选择器: empty {#Selectors:empty}
---------------------------------

匹配所有内容为空的元素

### 用法:

	':empty'

### 示例:

	$$('div:empty');

选择器: contains {#Selectors:contains}
---------------------------------------

匹配所有内容包含文本的元素

### 用法:

	':contains(text)'

### 变量:

* text - (string) 包含的文本内容

### 示例:

	$$('p:contains("find me")');


选择器: nth-child {#Selectors:nth-child}
-----------------------------------------

匹配所有制定序号的子元素

### 用法:

Nth 表达式:

	':nth-child(nExpression)'

### 变量:

* nExpression - (string) 表示要返回的元素的序号表达式

### 示例:

	$$('#myDiv:nth-child(2n)'); //返回偶数序的子元素

	$$('#myDiv:nth-child(n)'); //返回所有子元素

	$$('#myDiv:nth-child(2n+1)') //返回奇数序的子元素

	$$('#myDiv:nth-child(4n+3)') //返回如下序的子元素: 3, 7, 11, 15, 等等


所有奇数序子元素:

	':nth-child(odd)'

所有偶数序子元素:

	':nth-child(even)'

无兄弟节点的子元素:

	':nth-child(only)'

第一个子元素:

	'nth-child(first)'

最后一个子元素:

	'nth-child(last)'
	
### 备注:

本选择器遵循了w3c规范, 所以它以序号为1的作为它的第一个子元素, 而不是0. 因此,如果以0-based的视角来看,nth-child(odd)实际上得到的是偶数序的子元素

选择器: even {#Selectors:even}
-------------------------------

匹配所有偶数序的子元素

### 用法:

	':even'

### 示例:

	$$('td:even');
	
### 备注:

本选择器不是w3c规范的一部分, 因此它是以0为起始序的. 强烈推荐使用本选择器来替代nth-child(even), 因为它返回的是实际的偶数序子元素.

选择器: odd {#Selectors:odd}
-----------------------------

匹配所有奇数序的子元素

### 用法:

	':odd'

### 示例:

	$$('td:odd');
	
### 备注:

本选择器不是w3c规范的一部分, 因此它是以0为起始序的. 强烈推荐使用本选择器来替代nth-child(odd), 因为它返回的是实际的奇数序子元素.

选择器: first {#Selectors:first-child}
---------------------------------

匹配第一个子元素

### 用法:

	':first-child'

### 示例:

	$$('td:first-child');


选择器: last {#Selectors:last-child}
-------------------------------------

匹配最后一个子元素

### 用法:

	':last-child'

### 示例:

	$$('td:last-child');


选择器: only {#Selectors:only-child}
-------------------------------------

匹配无兄弟节点的子元素

### 用法:

	':only-child'

### 示例:

	$$('td:only-child');


[Element]: /Element/Element
[Selectors]: /Selectors/Selectors