Sharp jQuery key points summary (1) jQuery selector

Sharp jQuery key points summary (1) jQuery selector_jquery

WBOY

Release： 2016-05-16 18:31:44

Original

1193 people have browsed it

1 Basic selector

$(#id)
Matches an element based on the given id
$(.class)
Matches the element
$(element)
based on the given class name Matches the element
$(*) based on the given element name
Matches all elements
$(selector1,selector2,...,selectorN)
Merges the elements matched by each selector and returns them together

2 Hierarchical selector

$("ancestor descendant")
Select all descendant elements in the ancestor element
$( "parent > child")
Only selects child (sub-level) elements under the parent element, which is different from $("ancestor descendant"). The former selects all descendant elements (including but not limited to sub-level)
$('prev next')
Select the next element immediately after the prev element
$('prev ~ siblings')
Select prev The next element after the element

3 Filter Selector

3.1 Basic Filter Selector

$(" selector:first")
Select the first element
$("selector:last")
Select the last element
$("selector :not(selector2)")
Remove all elements that match the given selector
$("selector:even")
Select all elements with an even number , the index starts from 0
$("selector:odd")
Select all elements whose index is odd, the index starts from 0
$("selector:eq( index)")
Select elements with index equal to index, index starts from 0
$("selector:gt(index)")
Select elements with index greater than index , index starts from 0
$("selector:lt(index)")
Select elements with index less than index, index starts from 0
$(":header ")
Select all title elements, such as h1, h2, h3, etc.
$(":animated")
Select all elements currently being animated

3.2 Content filter selector

$(":contains(text)")
Select the content containing text as "text" Element
$(":empty")
Select an empty element that does not contain child elements or text
$(":has(selector2)")
Select elements that contain elements matched by the selector
$(":parent")
Select elements that contain child elements or text

3.3 Visible Sexual filter selector

$(":hidden")
Select all invisible elements
$(":visible")
Select all visible elements

3.4 Attribute filter selector

$("selector[attribute]")
Select the element with this attribute
$("selector[attribute=value]")
Select the element whose attribute value is value
$("selector[attribute! =value]")
Select elements whose attribute value is not equal to value
$("selector[attribute^=value]")
Select attribute value with value The starting element
$("selector[attribute$=value]")
Select the element whose attribute value ends with value
$("selector[attribute*= value]")
Select elements whose attribute values contain value
$("selector[selector2][selectorN]")
Use attribute selectors to merge into a composite Attribute selector that satisfies multiple conditions. Each time it is selected, the range is narrowed. For example, $("div[id][title$='test']") selects the

element

that has the attribute id and the attribute title ends with "test" 3.5 Child element filter selector

$(":nth-child(index/even/odd/equation)")
Select each parent element The index child element or odd-even element under the element, index starts from 1
$("selector:first-child")
Select the first child element of each parent element
$("selector:last-child")
Select the last child element of each parent element
$("selector:only-child")
If an element is the only child element of its parent element, it will be matched.If the parent element contains other elements, it will not be matched

3.6 Form object attribute filter selector

$(" selector:enabled")
Select all available elements
$("selector:disabled")
Select all disable elements
$("selector :checked")
Select all selected elements (radio, checkbox)
$("selector:selected")
Select all selected option elements (select )

4 Form selector

$(":input")
Select all ,