jquery $ selector Usage

1.$. In jquery $ ("<span>"), this syntax is equivalent to $ (document.createelement ("span"), which is a usage that can be used when selecting elements: [Attribute$=value], Matching a given property is an element that ends with some value. Here is an example to illustrate:
HTML code
<input name= "Newsletter"/>
<input name= "Milkman"/>
<input name= "Jobletter"/>
jquery Code:
$ ("input[name$= ' letter ']")
Results:
[<input name= "Newsletter"/&GT; <input name= "Jobletter"/>]
2.!. selector: [Attribute!=value], which matches all elements that do not contain the specified property, or the property is not equal to a particular value, which is equivalent to: not ([Attr=value]).
Examples illustrate:
HTML code
<input type= "checkbox" name= "Newsletter" value= "Hot Fuzz"/>
<input type= "checkbox" name= "Newsletter" value= "Cold fusion"/>
<input type= "checkbox" Name= "Accept" value= "evil plans"/>
jquery Code:
$ ("input[name!= ' newsletter ']"). attr ("Checked", true);
Results:
[<input type= "checkbox" Name= "Accept" value= "evil Plans" checked= "true"/>]
3.*. selector: [Attribute*=value], which matches the given property to an element that contains certain values. For example, explain:
HTML code:
<input name= "Man-news"/>
<input name= "Milkman"/>
<input name= "Letterman2"/>
<input name= "Newmilk"/>
jquery Code:
$ ("input[name*= ' Man ']")
Results:
[<input name= "Man-news"/&GT; <input name= "Milkman"/&GT; <input name= "letterman2"/>]
4.@. Matches the element that contains the given property. Note that in jquery 1.3, the leading @ symbol has been abolished! If you want to be compatible with the latest version, simply remove the @ symbol
Can
5.^. selector: [Attribute^=value], which matches a given property as an element that starts with some value, and here's an example to illustrate:
HTML code:
<input name= "Newsletter"/>
<input name= "Milkman"/>
<input name= "Newsboy"/>
jquery Code:
$ ("input[name^= ' News ']")
Results:
[<input name= "Newsletter"/&GT; <input name= "Newsboy"/>]

In jquery, when using $ ("Input[name= ' Metaid ']"). Val () cannot directly get the value of the selected radio, just get the first value of the radio tag, which may be relevant to jquery using the XPath language to find out. And we usually want to get the value of the selected radio, there are several ways:
1, use $ ("Input[name= ' Metaid ']:checked"). Val () Get//name Representative Name property name in radio
2, use $ (": radio:checked"). Val () Get//Limit page only a set of radio labels

Grammar Summary and Precautions
1. References to page elements the $ () reference element through jquery includes methods such as ID, class, element name, and hierarchy of elements and Dom or XPath conditions, and the returned object is a jquery object (a collection object) that cannot directly call the DOM-defined method.
2. The conversion of JQuery objects and Dom objects only jquery objects can use the method defined by jquery. Note that there is a difference between a DOM object and a jquery object, and the method is invoked with a DOM object or a jquery object in mind. Ordinary DOM objects can generally be converted to jquery objects by $ (). such as: $ (document.getElementById ("MSG") is a jquery object, you can use the method of jquery. Because the jquery object itself is a collection. So if the jquery object is to be converted to a DOM object, one of these items must be removed, which is generally accessible through the index. such as: $ ("#msg") [0],$ ("div"). EQ (1) [0],$ ("div"). get () [1],$ ("TD") [5] These are DOM objects, you can use the methods in DOM, but you can no longer use the jquery method. The following are correct: $ ("#msg"). html (); $ ("#msg") [0].innerhtml;$ (#msg). EQ (0) [0].innerhtml;$ ("#msg"). Get (0). innerHTML;

29.children (expr) Gets the child nodes, and when expr is empty, gets all the child nodes

Eg: <div><span>hello</span><p class= "selected" >hello Again</p><p>and again< /p></div>

$ ("div"). Children () ==>> [<span>hello</span><p class= "selected" >hello again</p><p >and Again</p>]

$ ("div"). Children (". Selected") ==>> [<p class= "selected" >hello again</p>]
Children pure selection function. When no argument is made, all child elements are selected. When there is a condition, it is selected as the condition. The second option is to select the node with class as selected!

30.add (params) adds a new node to the array of nodes taken by $.

parameter can be expr, html,element

Eg:1.<p>hello</p><span>hello again</span>

$ ("P"). Add ("span") ==>> [<p>hello</p>, <span>hello again</span>]

Eg:2.<p>hello</p>

$ ("P"). Add ("<span>again</span>") ==> [<p>hello</p>, <span>again</span>]

Eg:3.<p>hello</p><p><span id= "a" >hello again</span></p>

$ ("P"). Add (document.getElementById ("a")) ==>> [<p>hello</p>, <span id= "a" >hello again</ Span>]
Add elements or HTML content. Add to the element after the search. Example three, after extracting the child element of ID A to the P element, the status of the child element is changed, and the P element is tied

31.contains (str) to identify the node that contains str in the byte point, str to filter

Eg: <p>this is just a test.</p><p>so is this</p>

$ ("P"). Contains ("Test") ==>> [<p>this is just a test.</p>]

Contains is also a pure selection function. The parameter is the STR type. That is, select the node in test that contains the test content

32.filter (expression) filter to identify nodes that meet expression

Eg:<p>hello</p><p>hello again</p><p class= "selected" >and again</p>

$ ("P"). Filter (". Selected") ==>> <p class= "selected" >and again</p>

$ ("P"). Filter (". selected,: I") ==>> [<p>hello</p>, <p class= "selected" >and again</p >]
Belong to a multiple-condition query. Selected should be a node with class selected.: First should be a node!

Filter (FILTER_FUNC) selects whether filter by function, Filter_func returns true to filter

<p><ol><li>hello</li></ol></p><p>how are you?</p>

$ ("P"). Filter (function (index) {return $ (' ol ', this). length = = 0;}) ==>[<p>how are you?</p>]
Filter can also be conditional on the function!

33.find (expr) finds the consistent expr from a child node. The difference from filter is filter out the $ array of nodes find filtered to the child nodes

Eg: <p><span>hello</span>, how are you?</p>

$ ("P"). FIND ("span") ==>> [<span>hello</span>]
Contrary to the filter, the feeling is similar

34.is (expr) determines whether a condition is eligible, returns False if all nodes of the $ array do not qualify, returns true if one of the criteria is met

Eg: <form><p><input type= "checkbox"/></p></form>

$ ("input[@type = ' checkbox ']"). Parent (). is ("form") ==>> false

$ ("input[@type = ' checkbox ']"). Parent (). Is ("P") ==>> True
Conditional judgment!

35.next (expr) Gets the node of the nearest node. Expr gets all nodes when it is empty

Eg:1.<p>hello</p><p>hello Again</p><div><span>and Again</span></div >

$ ("P"). Next () ==>> [<p>hello again</p>, <div><span>and again</span></div> ]

Eg:2.<p>hello</p><p class= "selected" >hello Again</p><div><span>and again</ Span></div>

$ ("P"). Next (". Selected") ==>>[<p class= "selected" >hello again</p>]
It's nothing special.

Not (EL), not (expr), and not (Elems), in contrast to add, deletes a node that meets the criteria.

Eg:1. <p>hello</p><p id= "selected" >hello again</p>

$ ("P"). Not ($ ("#selected") [0]) ==>> [<p>hello</p>]

$ ("P"). Not ("#selected") ==>> [<p>hello</p>]

Eg:2.<div><p>hello</p><p class= "selected" >hello again</p></div>

$ ("P"). Not ($ ("div p.selected") ==>> [<p>hello</p>]
Delete a node in a condition, back to the result of the deletion

Radix Notoginseng (expr) Gets the parent node

Eg:1.

$ ("span"). Parents () ==>> [<body>...</body>, <div>...</div> <p><span> Hello</span></p>]
Gets all parent nodes when the argument is empty

Eg:2.

$ ("span"). Parents ("P") ==>>[<p><span>hello</span></p>]
Gets the first parent node if a condition is available.

38.prev (expr) In contrast to next, the next acquisition is adjacent to the node. Prev Gets the adjacent front

Eg:1.<div><span>hello</span></div><p class= "selected" >hello again</p><p >and again</p>

$ ("P"). Prev (". Selected") ==>> [<div><span>hello</span></div>]

Eg:2.<p>hello</p><div><span>hello Again</span></div><p>and again</p >

$ ("P"). Prev () ==>> [<div><span>hello again</span></div>]
This is obvious, to get the node before the condition. Next is not so obvious,

39.siblings (expr) Gets the nodes adjacent to each other are. Next, with the Prev
These two combine next and prev.