Three types of jquery $ ()

The $ number is a nickname for jquery "Class", and $ () constructs a jquery object. So, "$ ()" can be called JQuery's constructor (personal view, hehe!) ）。

1, $ () can be $ (expresion), which is the CSS selector, XPath, or HTML element, that is, the above expression to match the target element.
For example: $ ("a") constructs a jquery object with a CSS selector-it selects all <a/> this tag. Such as:
$ ("a"). Click (function () {...})
Is the trigger event when you click on any link on the page. Specifically, jquery uses the <a/> tag to build an object $ ("a"), and the function click () is an (event) method of this jquery object.

For example, there is this HTML code:

The code is as follows:

<p>one</p>
<div>
<p>two</p>
</div>
<p>three</p>
<a href= "#" id= "test" onclick= "JQ ()" >jQuery</a>

And the operation of this HTML is the following statement:
Alert ($ ("div>p"). html ());

$ () is a query expression that constructs a jquery object with a query expression such as "div>p", and then "HTML ()" means to display its HTML content, which is [both] of the above HTML snippet. Again such as:
$ ("<div><p>Hello</p></div>"). AppendTo ("body");
$ () is a string that is used to build the jquery object, and then add the word string to <body/>.

2, $ () can be $ (element), which is a specific DOM element. such as the common DOM object has document, location, form and so on. Like this line of code:
$ (document). Find ("Div>p"). html ());
Document in $ () is a DOM element that looks for the <div> element with <p> in full text and displays the contents of <p>.
3, $ () can be a $ (function), that is, a functions, it is $ (document). Ready () in a shorthand manner. As is common in the form of this:
$ (document). Ready (function () {
Alert ("Hello world!");
});
Can be deformed as:
$ (function () {
Alert ("Hello world!");
});

There are two ways to select Elements,jquery in an HTML document:
1) such as $ ("Div>ul a"), it means a tag in the UL tag in the DIV tag
However, $ (' Div>ul ') and $ (' div ul ') are different,


$ (' Div>ul ') is a direct descendant of <div> to find <ul>;
and $ (' div ul ') is found in all descendants of <div> <ul>.



2) Several methods of using jquery objects (such as method find (), each (), and so on)
$ ("#orderedlist"). Find ("Li") is like $ ("#orderedlist Li"). Each () Iterates over all Li, and "#" in the expression represents the ID in the HTML, as in the previous example "#orderedlist" means "the label with ID orderedlist."

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

1, Tag Selector $ (' P '), class selector $ ('. MyClass '), ID selector $ (' #myId ') is relatively simple, not much to say. But there is a little--$ (' Div>ul ') and $ (' div ul ') there is a difference,
$ (' Div>ul ') is a direct descendant of <div> looking for <ul>; and $ (' div ul ') is found in all descendants of <div> <ul>.
Therefore, $ (' #sId >li ') selects all <li> child nodes with the id "sId", even if the descendant of this <li> is also not the range it is looking for (the DOM object that is found is just its level DOM object.) ）。 The $ (' #sId li:not (. Horizontal) ') means that all Li descendants in the class name "SId" do not have all the elements of the horizontal class. The NOT () here is a negation pseudo class.
The return is a Jqurey object, an array object, and the length of this jquery object is available. Length ().
2. XPath Selector
For example: Select All links with the title attribute, we will write: $ (' a[@title] ')
[] with @, stating [] is the attribute of the element; it's a property selector.
[] There is no @, stating [] The descendants of the elements.
$ (' ul Li ') and $ (' ul[li] ') Although the return is a jquery array, the meaning of the two is exactly the opposite. The former is to find <ul> under all <li> descendants, but the latter is looking for all descendants <li> <ul> array.
In XPath, find a "with ... The "Start" property, with ^=, such as finding a Name property that is the input element that begins with mail, uses the
$ (' input[@name ^= "Mail"])
To find a "to ... End "of the property, to use $=
To find a "no-no-no-end" attribute, use *=

3, does not belong to the above CSS and the XPath selector, is the custom selector, uses ":" to indicate, here to use is: First,:last,:p arent,: hidden,:visible,:odd,:even,:not (' xxx '), ": EQ (0) "(starting from 0),: Nth (n),: GT (0),: LT (0),: Contains (" XXX ")
such as: $ (' Tr:not ([th]): even ') means even-numbered entries of all descendants of the <tr> element that do not contain <th>

4, there are a few, simply do not explain
$ (' th '). Parent ()--
$ (' Td:contains (' Henry ') '). Prev ()--the previous node of <td> containing "Henry"
$ (' Td:contains (' Henry ') '). Next ()--the next node of <td> that contains "Henry"
$ (' Td:contains (' Henry ') '). Siblings ()--all sibling nodes with "Henry" <td>
There is also an end (), which must be used when a DOM node performs a certain action and wants to perform a similar action on its associated node, where end () will be used. After the end () method is used, the parent node of the node on which the action is executed is returned. As an example,
$(...). Parent (). Find (...). AddClass (). End ()
The node where the action is performed is the Find (...), which is an array object, the action of which is "addclass ()", followed by an end (), and what is returned is pointing to the node that the parent () points to, that is, executing "addclass ()" The parent node of the array object for the action.

5. To access the DOM element directly, use the Get (0) method, such as
$ (' #myelement '). Get (0) can also be indented as $ (' #myelement ') [0]

Three types of jquery $ ()