JQuery learning notes-Use of the jQuery selector _ jquery

Source: Internet
Author: User
The most important and appealing component of jQuery is the selector. below is the meaning of various selector tokens. I. Basic selector:

  • # Id: select the element with the given ID name, for example, $ ("# id1") as the element with the id set to id1.
  • . Class: select the element of the given class name
  • Element: Selects all primary colors of a given element name.
  • *: Matches all elements.
  • Selector1, selector2,...: Elements of these names are separated by commas (,). They can be class or id names.

2. Level selector:

  • $ ("Ancestor descendant"): select all descendant (descendant) elements under ancestor.
  • $ ("Parent> child"): select all child (child) elements under the parent.
  • $ ('Prev + next'): select the first next element next to prev.
  • $ ('Prev ~ Siblings '): select all siblings elements after prev.

$ ('Prev + next') works the same as $ (. prev). next ("next ")

$ ('Prev ~ Siblings ') and $ (. prev). nextAll ("siblings") act the same way

3. filter selection:

  • : First select the first element, for example, $ ("p: first") to select the first p element.
  • : Last select the last element
  • : Not (selector) Select an element that is not a selector
  • : Even: select an even index element.
  • : Odd Selects all elements of an odd Index
  • : Eq (index) Select an element whose index is equal to index
  • : Gt (index) Select an element whose index is greater than index
  • : Lt (index) Select the element whose index is smaller than index
  • : Select all headers Element
  • : Animanted: Select All animation Elements

4. Content Filtering:

  • : Contains (text) Select an element containing text, for example, $ ("p: contains ('hello')") as the p element containing the hello character.
  • : Empty Selects all non-character elements
  • : Has (selector) selects an element containing the selector Element
  • : Parent: select an element containing child elements.

5. Visibility Filtering:

  • : Hidden select all visible elements
  • : Visible: select all invisible elements

Sat. Attribute Filtering:

  • [Attribute] select the element that owns this attribute. For example, $ ("p [id]") Select the p element that contains the id attribute.
  • [Attribute = value] Select an element whose attribute is equal to the value
  • [Attribute! = Value] Select an element whose attribute is not equal to the value
  • [Attribute ^ = value] Select an element whose attribute is equal to the value
  • [Attribute $ = value] select the element whose attribute value starts with value
  • [Attribute * = value] Select an element whose attribute value contains the value.
  • [Selector1] [selector2]... elements that meet these conditions (combinations)

7. Child element filter Selector

  • : Nth-child (index/even/odd/eqation): select the child element of [index/even/odd] under the parent Element
  • : First-child: select the first child element of the parent element.
  • : Last-child: select the last child element of the parent element.
  • : Only-child: select a unique child element under the parent element.

8. Form attribute Filtering

  • : Enabled: select all visible elements. For example, $ ("# form1: enabled") indicates all available elements whose form id is form1.
  • : Disable: select all invisible elements
  • : Checked: select all selected elements
  • : Selected: select all selected option Elements

9. Form object Filtering

  • : Input select allElement: Select all single-line text for text. The following format is used.: Password: Radio: Checkbox: Submit: Image: Reset: Button: File: Hidden
Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.