yui3 html属性,jQuery - YUI 3区别

$('*')

Y.all('*')

Select all nodes. Note that the default selector engine for YUI

is CSS 2.1. For all examples in this section, use the

selector-css3 module for YUI.

$(':animated')

Psuedoclass to select all elements currently being animated. No

YUI equivalent.

$(':button')

Y.all('input[type=button], button')

Extension. In both jQuery and YUI you can run multiple selectors

separated by commas.

$(':checkbox')

Y.all('input[type=checkbox]')

Extension.

$(':checked')

Y.all(':checked')

CSS3

$('parent > child')

Y.all('parent > child')

Immediate child selector (child must be one level below

parent)

$('parent child')

Y.all('parent child')

Descendent selector (child can be at any level below parent)

$('div.class')

Y.all('div.class')

Class selector

$(":contains('foo')")

Y.all(':contains(foo)')

Extension to select all elements whose text matches 'foo'.

jQuery can take quotes or not. YUI requires no quotes. The text

matching is plain string comparison, not glob or regexp. Be careful

with this one as it will return all matching ancestors, eg

[html, body, div].

$(':disabled')

$(':enabled')

Y.all(':disabled')

Y.all(':enabled')

CSS3. 'input[disabled]' and

'input:not([disabled])' also work in both

libraries.

$(':empty')

Y.all(':empty')

CSS3. Selects all elements that have no child nodes (excluding

text nodes).

$(':parent')

Y.all(':not(:empty)')

Inverse of :empty. Will find all elements that are

a parent of at least one element. jQuery's version is an extension.

YUI's is CSS3.

$('div:eq(n)')

Y.all('div').item(n)

Extension. Selects nth element. YUI's item()

will return null if there is no nth

element. jQuery's selector will return an empty list

[] on a match failure.

$('div:even')

$('div:odd')

Y.all('div').even()

Y.all('div').odd()

Extension. Selects all even or odd elements. Note that elements

are 0-indexed and the 0th element is considered even. See also

YUI's NodeList.modulus(n, offset).

$(':file')

Y.all('input[type=file]')

Extension. Find input elements whose type=file.

$('div:first-child')

Y.all('div:first-child')

CSS3. Selects the first child element of divs.

$('div:first)

Y.one('div')

The .one() method returns null if

there is no match, and a single Node object if there is.

$('div:gt(n)');

$('div:lt(n)');

// or

$('div').slice(n + 1);

$('div').slice(0,n);

Y.all('div').slice(n + 1);

Y.all('div').slice(0, n);

Extension. :gt (greater than) selects all elements

from index n+1 onwards. :lt (less than)

selects all nodes from 0 up to n-1.

$('div:has(p)')

var nodes = [];

Y.all('div').each(function (node) {

if (node.one('p')) {

nodes.push(node);

}

});

nodes = Y.all(nodes);

Extension. Selects elements which contain at least one element

that matches the specified selector. In this example, all

div tags which have a p tag descendent

will be selected.

$(':header')

Y.all('h1,h2,h3,h4,h5,h6')

Extension. Selects all heading elements. Rarely used.

$('div:hidden')

var hidden = [];

Y.all('div').each(function(node) {

if ((node.get('offsetWidth') === 0 &&

node.get('offsetHeight') === 0) ||

node.get('display') === 'none') {

hidden.push(node);

}

});

hidden = Y.all(hidden);

Extension. In jQuery > 1.3.2 :hidden

selects all elements (or descendents of elements) which take up no visual space. Elements with

display:none or whose

offsetWidth/offsetHeight equal 0 are considered

hidden. Elements with visibility:hidden are not

considered hidden.

The YUI equivalent would essentially be a port of the jQuery

code that implements :hidden. This might be a good

candidate for a patch to YUI.

$('#id')

Y.all('#id')

CSS3. Identity selector.

$('input:image')

Y.all('input[type=image]')

Extension. Selects all inputs of type image.

$(':input')

Y.all('input,textarea,select,button')

Extension. Selects all user-editable form elements.

$(':last-child')

Y.all(':last-child')

CSS3.

$('div:last')

var list = Y.all('div'),

last;

if (list.size()) {

last = list.item(list.size() - 1);

}

Extension. Selects the last element matched by

the selector.

$('input[type=checkbox][checked]')

Y.all('input[type=checkbox][checked]')

CSS3, multiple attribute selector

$(':not(div)')

Y.all(':not(div)')

CSS3. Negation selector.

$(':password')

Y.all('input[type=password]')

Extension.

$(':radio')

Y.all('input[type=radio]')

Extension.

$(':reset')

Y.all('input[type=reset]')

Extension.

$(':selected')

Y.all('option[selected]')

Extension.

$(':submit')

Y.all('input[type=submit]')

Extension.

$(':text')

Y.all('input[type=text]')

Extension. Does not select textarea elements.