MooTools
a compact javascript framework
MooTools Core v1.4.5
Core
Browser
Slick
Slick
Slick是MooTools的选择器引擎。它支持多种CSS2/CSS3选择器!Reverse Combinators
逆向选则器.示例:
document.getElement('p ! div') //一个<div>,并这个<div>是<p>的祖先
document.getElement('p !> div') // 一个<div>,并这个<div>是<p>的直接父类(中间没有间隔其它元素)
document.getElement('.foo !+ p') // 获取上一个相邻<P>兄弟节点
Function: Slick.definePseudo
definePseudo允许你创建自己的自定义伪选择器。示例:
Slick.definePseudo('display', function(value){
return Element.getStyle(this, 'display') == value;
});
bar
$$(':display(block)'); // Will return the block element
Slick.definePseudo('my-custom-pseudo', function(){
// 'this' is the node to check
return Element.retrieve(this, 'something-custom').isAwesome;
});
$$(':my-custom-pseudo') // Will return the first tag that is awesome
Selector: Next Siblings ('~')
获取下一个兄弟节点。例如:
$$('p.foo ~') // Gets all next siblings of
$$('p.foo ~ blockquote') // Gets every
with asibling somewhere *before* it
Selector: Previous Siblings ('!~')
获取上一个兄弟节点。例如:
$$('p.foo !~') // Gets all previous siblings of
$$('p.foo !~ blockquote') // Gets every
with asibling somewhere *after* it
Selector: All Siblings ('~~')
获取所有的兄弟节点。例如:
$$('p.foo ~~') // Gets all previous and next siblings of
$$('p.foo ~~ blockquote') // Gets every
with asibling before OR after it
Selector: First Child ('^')
获取元素的第一个子节点。例如:
$$('p.foo ^') // Gets the first child of
$$('p.foo ^ strong') // Gets every that is the first element child of a
Selector: Last Child ('!^')
获取元素的最后一个子节点。例如:
$$('p.foo !^') // Gets the last child of
$$('p.foo !^ strong') // Gets every that is the last element child of a
Selector: checked
匹配所有checked的元素。示例:
$$(':checked')
$('myForm').getElements('input:checked');
Selector: enabled
匹配所有enabled的元素。示例:
$$(':enabled')
$('myElement').getElements(':enabled');
Selector: empty
匹配的是空的所有元素。例如:
$$(':empty');
Selector: contains
匹配所有包含文本的元素。变量:
- text - (string)该元素应包含的文本。
例如:
$$('p:contains("find me")');
Selector: focus
获取取得焦点的元素。例如:
$$(':focus'); // Gets the element in focus
Selector: not
匹配那些不匹配的所有元素。示例:
$$(':not(div.foo)'); // all elements except divs with class 'foo'
$$('input:not([type="submit"])'); // all inputs except submit buttons
myElement.getElements(':not(a)');
$$(':not(ul li)');
Selector: nth-child
匹配第n(表达式)个子元素。用法:
':nth-child(nExpression)'
变量:
- nExpression - ( String)一个数学表达式。
示例:
$$(':nth-child(1)'); //Returns Element #i1.
$$(':nth-child(2n)'); //Returns Elements #i2 and #i4.
$$(':nth-child(2n+1)') //Returns Elements #i1, #i3 and #i5.
$$(':nth-child(3n+2)') //Returns Elements #i2 and #i5.
每个奇数节点(同为2n+1):
':nth-child(odd)'
每个偶数数节点(同为2n):
':nth-child(even)'
Selector: nth-last-child
匹配每n(表达式)个子元素,从最后一个子元素开始。用法:
':nth-last-child(nExpression)'
变量:
- nExpression - ( String)一个数学表达式。
示例:
$$(':nth-last-child(1)'); //Returns Element #i5.
$$(':nth-last-child(2n)'); //Returns Elements #i2 and #i4.
$$(':nth-last-child(2n+1)') //Returns Elements #i1, #i3 and #i5.
$$(':nth-last-child(3n+2)') //Returns Elements #i1 and #i4.
每个奇数元素(同为2n+1):
':nth-last-child(odd)'
每一个偶数元素(同为2n):
':nth-last-child(even)'
Selector: even
匹配每个偶数节点.例如:
$$('td:even');
Selector: odd
匹配每个奇数节点.例如:
$$('td:odd');
Selector: index
匹配指定索引的节点.例如:
$$('p:index(2)'); // Gets the third
tag.
注意:
这是零基数索引。Selector: first-child
匹配的第一个子元素。语法:
':first-child'
例如:
$$('td:first-child');
Selector: last-child
匹配最后一个子元素。语法:
':last-child'
例如:
$$('td:last-child');
Selector: only-child
匹配其父元素的唯一的子元素。语法:
':last-child'
例如:
$$('td:last-child');
copyright ©2006-2014 Valerio Proietti , translate by Jobin Sun