Three types of jquery $ ()

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 <A/> labels. For example:
$ ("A"). Click (function (){...})
Is the trigger event when you click any link on the page. Specifically, jquery uses the <A/> label to construct an object $ ("A"), and the function click () is an (event) method of this jquery object.

For example, there is such an htmlCode:

Copy 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>

The operation of this section of HTML is as follows:
Alert ($ ("div> P" pai.html ());

$ () Is a query expression, that is, using a query expression such as "div> 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:
$ ("<Div> <p> Hello </P> </div>"). appendto ("body ");
$ () Is a string that constructs a jquery object with such a string and adds the string to <body/>.

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 ("div> P" document .html ());
The document in $ () is a DOM element. it searches for <div> elements with <p> In the full text and displays the content in <p>.
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, $ ("div> ul a") indicates a tag in the UL tag of the DIV tag.
However, $ ('div> U') and $ ('div U') are different,

$ ('Div> ul ') is the direct descendant of <div> Find <ul>;
$ ('Div ul') is used to find <ul> in all <div> descendants.

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 $ ('div> ul ') and $ ('div ul').
$ ('div> ul ') is

in the direct descendant of
, while $ ('div ul ') is found in all descendants of

.
therefore, $ ('# Sid> li') selects all
• child nodes whose ID is "Sid, even if the
• descendant has
• , it is not the range it is looking for (the DOM object found is only its own DOM object .). $ ('# 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.
  here, a jqurey object and an array object are returned. 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 [], and an attribute selector
  [] does not contain @, description [] is the descendant of an element.
  $ ('ul li ') and $ ('ul [Li]') return a jquery array, but they have the opposite meaning. The former is to find
  all
  • descendants, while the latter is to find the
    array where all descendants are
    • .
      In XPath, you need to find... for example, to find an input element whose name attribute starts with mail,
      $ ('input [@ name ^ = "mail"] ')
      ... to use $ =
      to find a "No header 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') indicates the even number of all descendants of <TH> not included in <tr> element.

4. There are a few more. I will not explain them.
$ ('Th'). Parent ()--
$ ('Td: Contains ("Henry") '). Prev () -- The content contains the previous node of <TD> of "Henry"
$ ('Td: Contains ("Henry") '). Next () -- The content contains the next node of <TD> with "Henry"
$ ('Td: Contains ("Henry") '). siblings () -- The content contains all <TD> sibling nodes of "Henry"
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]