jquery Common Selector

Jquery.noconflict (); Voluntary Surrender $ () alias

I. Basic Selector
A) Select elements by tag type
$ ("P")

b) Select elements by class
$ (". Foo");

c) SELECT elements by ID
$ ("#bar");

D) Joint selector for more precise selection
$ ("Span.foo"). html (); The class of all spans is the element of Foo
$ (". Left span"). HTML (); All span elements under class left

e) Use the combo selector to access multiple elements
$ ("P.foo, #bar");

Two. Hierarchy Selector
A) Select descendant elements
Ancestor element descendant element $ ("body span");

b) Select child elements
Parent element > child element $ ("Body>span");

c) Select the next sibling element and the next element immediately after selecting an element in the DOM
Start element ID + next sibling element ID
$ (". Foo+p"); $ ("p+p");

d) Select sibling elements, all elements of the same level wrapped by the same element, and return all sibling elements after the starting element
$ (". Foo~p"); $ (". Con1 ~div");

Three. Basic Filter
Does not depend on the element type, the class of the element, the element ID, but matches the element based on the position's current state or other mutable parameters
: Filter Name: Filter name (parameter)
A) Select a first or last element
Determines whether an element is the first or the last in a collection
$ ("P:last"); $ ("Div:first");

b) Select an element that does not match a selector
$ ("Div:not (. left)"); Select All div and its class is not left

c) Select an element with an odd or even index
: Even and: odd
$ ("div:odd"); All div with an odd index

e) Select elements for a specific index
Pass an index number to: EQ () filter, which can get the element
$ ("Div:eq (5)"); Index numbering starts at 0

Four. Content Filter
Match elements based on element content, matching elements that include specific text, matching elements containing specific elements
A) match elements that contain specific text
: Contains () (case sensitive)
$ ("Span:contains (brand)"); Matches all span elements that contain branding in a span

b) Match elements that contain specific elements
: Has ()
$ ("P:has (span)"); Returns a P element that contains only span

c) Select an empty element
Find empty elements that do not contain any text or contain any elements: empty
$ ("Div:empty"); Match <div></div> Middle cannot have any content that contains a space and does not match
d) Select parent element
In contrast to: empty: The parent matches only those elements that have child elements, whether they contain elements or content
$ ("p:parent");

Five. Visibility filter
A): Hidden and: Visible, respectively, for selecting hidden elements and visible elements
$ ("p:visible"); Match all visible P-elements

Six. Attribute filter (use the ID and class selector as much as possible in the script, not only fast or good habits)
A) Select elements based on the values of attributes and attributes
Place attributes and values in square brackets [];
[Property Name = property value]
$ ("div[class=left]"); Match all DIV elements that are class left

b) Select elements that do not have an attribute or attribute values that do not match
[Property name!] = attribute value]
$ ("div[class!=left]"); Match all DIV elements that are not left for class

Seven. Sub-element filter

A) an element that matches an odd index value/even index value/a specific index value
: Nth-child (), which provides 4 parameters when matching an element: Even, odd, index, and equation
The index of this filter starts at 1 instead of 0.
$ ("Div:nth-child (Odd)"); Match index of all Odd index div starting from 1

b) Select the first or last child element
: First-child and: Last-child returned element collection may have more than one element
$ ("div a:last-child"); Matches the last a element in all Div

Eight. Form Filter
A) match by Form element type
The available form filters are: button,: checkbox,: File,: Image,: input,: password,
: Radio,: Submit,: Text
$ ("Input:radio"); Select All radio buttons

b) match the available or disabled form elements
: Enable and disabled are used to match the available and disabled form elements, respectively
$ (":d isabled"); Select a disabled FORM element

c) match a selected or unchecked form element
The radio button and check boxes have a checked status, and the drop-down box has a selected status, filter: Checked and
: Selected assigns form elements that are used to get checked and selected as True
$ (": Checked");

jquery Common Selector