Three types of jQuery $ () _ jquery

$ Is a special name of the jQuery "class". $ () constructs a jQuery object. Therefore, "$ ()" can be called the jQuery Constructor (in my opinion, haha !). 1. $ () can be $ (expresion), that is, the css selector, Xpath, or html element, that is, matching the target element through the above expression.
For example, $ ("a") constructs a jQuery object using the CSS selector-it selects all the tags. For example:
$ ("A"). click (function (){...})
Is the trigger event when you click any link on the page. Specifically, jQuery uses this label to construct an object $ ("a"), and the function click () is an (event) method of this jQuery object.

For example, there is such an HTML code:

The Code is as follows:

One

Two

Three

JQuery

The operation of this section of HTML is as follows:
Alert ($ ("p> p" example .html ());

$ () Is a query expression, that is, using a query expression such as "p> p" to construct a jQuery object, and then the "html () "display the html content, that is, the [two] of the preceding HTML code segment. Another example is:
$ ("

Hello

"). AppendTo (" body ");
$ () Is a string that constructs a jQuery object with such a string, and then.

2. $ () can be $ (element), which is a specific DOM element. For example, common DOM objects include document, location, and form. Such as a line of code:
$ (Document). find ("p> p" example .html ());
The document in $ () is a DOM element.

Of

And display

.
3. $ () can be $ (function), which is a stenographer of $ (document). ready. For example, the common form is as follows:
$ (Document). ready (function (){
Alert ("Hello world! ");
});
Deformation:
$ (Function (){
Alert ("Hello world! ");
});

JQuery has two methods for selecting elements in HTML documents:
1) For example, $ ("p> ul a") indicates a tag in ul tag of p.
However, $ ('P> ul ') and $ ('P ul') are different,


$ ('P> ul ') Yes

Find

;
While $ ('P') is in

Find all future generations

.



2) several methods of using jQuery objects (such as find () and each)
$ ("# Orderedlist ). find ("li") is like $ ("# orderedlist li "). each () iterates all li resources, while "#" in the expression indicates the ID in HTML. In the preceding example, "# orderedlist" indicates "ID is the tag of orderedlist ".

**************************************** ************************

1. The tag selector $ ('P'), class selector $ ('. myclass'), and id selector $ (' # myid') are relatively simple. However, there is a difference between $ ('P> ul ') and $ ('P ul,
$ ('P> ul ') Yes

Find

While $ ('P') is in

Find all future generations

.
Therefore, $ ('# sId> li') selects all
• Child node, even if this
• Also has
• It is not the scope it is looking for (the DOM object found, but its DOM object at its own level .). $ ('# SId li: not (. horizontal)') indicates that all elements of the horizontal class are not contained in all li children in the class name "sId. -- The not () Here is a negation pseudo class.
  The returned result is a jQurey object, an array object. The length of this jQuery object can be obtained by. length.
  2. XPath Selector
  For example, if you select all links with the title attribute, We will write: $ ('a [@ title] ')
  [] Contains @, indicating that the attribute of the element is in []; it is an attribute selector.
  [] Does not contain @, indicating that [] contains the descendant of the element.
  $ ('Ul li') and $ ('ul [li] ') return a jQuery array, but they have the opposite meaning. The former is to find
  All
  • While the latter is looking for all descendants
  • Of
    Array.
    In XPath, you need to find an attribute starting with "..." and use ^ =. For example, to find an input element whose name attribute starts with mail, use
    $ ('Input [@ name ^ = "mail"] ')
    To find an attribute ending with..., use $ =
    To find a "no head or no tail" attribute, use * =
    
    3. It does not belong to the above CSS and XPath selectors, that is, the custom selector, which is represented by ":". The following is used: first,: last,: parent ,: hidden,: visible,: odd,: even,: not ('xxx'), ": eq (0)" (starts with 0),: nth (n ),: gt (0),: lt (0),: contains ("xxx ")
    For example, $ ('tr: not ([th]): even') indicatesThe child of the element does not containThe even number of all descendants
    
    4. There are a few more. I will not explain them.
    $ ('Th'). parent ()--
    $ ('Td: contains ("Henry") '). prev () -- The content contains "Henry"The previous node
    $ ('Td: contains ("Henry") '). next () -- The content contains "Henry"Next node
    $ ('Td: contains ("Henry") '). siblings () -- The content contains "Henry"All sibling nodes
    Another method is end (). This method must be used after a DOM node executes an action and wants to execute similar actions on its related nodes, end () is used here (). After the end () method is used, the returned result is the parent node of the node that executes the action. For example
    $ (...). Parent (). find (...). addClass (). end ()
    The node where the action is executed is find (...), it is an array object. Its action is "addClass ()", and then an end () is used. Then, the returned result points to the node pointed to by parent, that is, the parent node of the array object that executes the "addClass ()" action.
    
    5. to directly access the DOM element, use the get (0) method, as shown in figure
    $ ('# Myelement'). get (0), which can also be abbreviated as $ ('# myelement') [0]