JQuery in Action学习笔记一

1、onload方法在DOM树创建完成和页面所有元素被载入之后才会运行

JQuery风格的

windows.onload(function(){

/*your coed goes here*/

});

$(function() {

  $("table tr:nth-child(even)").addClass("even");

});

2、JQuery选择器的使用

语法：$(”Selector”)，相关站点http://docs.jquery.com/Selectors

3、用JQuery创建新的dom元素

$("<p>Hi there!</p>")

 

4、JQuery选择器使用

API/1.2/Selectors

From jQuery JavaScript Library

Name Type Basics: Name Type

#id	Returns: Array<Element>
Matches a single element with the given id attribute.
element	Returns: Array<Element(s)>
Matches all elements with the given name.
.class	Returns: Array<Element(s)>
Matches all elements with the given class.
*	Returns: Array<Element(s)>
Matches all elements.
selector1, selector2, selectorN	Returns: Array<Element(s)>
Matches the combined results of all the specified selectors.

Hierarchy: Name Type

ancestor descendant	Returns: Array<Element(s)>
Matches all descendant elements specified by "descendant" of elements specified by "ancestor".
parent > child	Returns: Array<Element(s)>
Matches all child elements specified by "child" of elements specified by "parent".
prev + next	Returns: Array<Element(s)>
Matches all next elements specified by "next" that are next to elements specified by "prev".
prev ~ siblings	Returns: Array<Element(s)>
Matches all sibling elements after the "prev" element that match the filtering "siblings" selector.

Basic Filters: Name Type

:first	Returns: Array<Element>
Matches the first selected element.
:last	Returns: Array<Element>
Matches the last selected element.
:not(selector)	Returns: Array<Element(s)>
Filters out all elements matching the given selector.
:even	Returns: Array<Element(s)>
Matches even elements, zero-indexed.
:odd	Returns: Array<Element(s)>
Matches odd elements, zero-indexed.
:eq(index)	Returns: Array<Element>
Matches a single element by its index.
:gt(index)	Returns: Array<Element(s)>
Matches all elements with an index above the given one.
:lt(index)	Returns: Array<Element(s)>
Matches all elements with an index below the given one.
:header	Returns: Array<Element(s)>
Matches all elements that are headers, like h1, h2, h3 and so on.
:animated	Returns: Array<Element(s)>
Matches all elements that are currently being animated.

Content Filters: Name Type

:contains(text)	Returns: Array<Element(s)>
Matches elements which contain the given text.
:empty	Returns: Array<Element(s)>
Matches all elements that have no children (including text nodes).
:has(selector)	Returns: Array<Element(s)>
Matches elements which contain at least one element that matches the specified selector.
:parent	Returns: Array<Element(s)>
Matches all elements that are parents - they have child elements, including text.

Visibility Filters: Name Type

:hidden	Returns: Array<Element(s)>
Matches all elements that are hidden, or input elements of type "hidden".
:visible	Returns: Array<Element(s)>
Matches all elements that are visible.

Attribute Filters: Name Type

[attribute]	Returns: Array<Element(s)>
Matches elements that have the specified attribute.
[attribute=value]	Returns: Array<Element(s)>
Matches elements that have the specified attribute with a certain value.
[attribute!=value]	Returns: Array<Element(s)>
Matches elements that don't have the specified attribute with a certain value.
[attribute^=value]	Returns: Array<Element(s)>
Matches elements that have the specified attribute and it starts with a certain value.
[attribute$=value]	Returns: Array<Element(s)>
Matches elements that have the specified attribute and it ends with a certain value.
[attribute*=value]	Returns: Array<Element(s)>
Matches elements that have the specified attribute and it contains a certain value.
[attributeFilter1][attributeFilter2][attributeFilterN]	Returns: Array<Element(s)>
Matches elements that match all of the specified attribute filters.

Child Filters: Name Type

:nth-child(index/even/odd/equation)	Returns: Array<Element(s)>
Matches all elements that are the nth-child of their parent or that are the parent's even or odd children.
:first-child	Returns: Array<Element(s)>
Matches all elements that are the first child of their parent.
:last-child	Returns: Array<Element(s)>
Matches all elements that are the last child of their parent.
:only-child	Returns: Array<Element(s)>
Matches all elements that are the only child of their parent.

Forms: Name Type

:input	Returns: Array<Element(s)>
Matches all input, textarea, select and button elements.
:text	Returns: Array<Element(s)>
Matches all input elements of type text.
:password	Returns: Array<Element(s)>
Matches all input elements of type password.
:radio	Returns: Array<Element(s)>
Matches all input elements of type radio.
:checkbox	Returns: Array<Element(s)>
Matches all input elements of type checkbox.
:submit	Returns: Array<Element(s)>
Matches all input elements of type submit.
:image	Returns: Array<Element(s)>
Matches all input elements of type image.
:reset	Returns: Array<Element(s)>
Matches all input elements of type reset.
:button	Returns: Array<Element(s)>
Matches all button elements and input elements of type button.
:file	Returns: Array<Element(s)>
Matches all input elements of type file.
:hidden	Returns: Array<Element(s)>
Matches all elements that are hidden, or input elements of type "hidden".

Form Filters: Name Type

:enabled	Returns: Array<Element(s)>
Matches all elements that are enabled.
:disabled	Returns: Array<Element(s)>
Matches all elements that are disabled.
:checked	Returns: Array<Element(s)>
Matches all elements that are checked.
:selected	Returns: Array<Element(s)>
Matches all elements that are selected.