JQuery self-study notes (2): jQuery selector and jquery Selector

Source: Internet
Author: User

JQuery self-study notes (2): jQuery selector and jquery Selector
1. Simple selector ID selector: $ ('# box') element Tag Name: $ ('div') class selector: $ ('. box ') jQuery provides two methods: length and size () to view the returned elements. You can verify that the ID appears only once on the page. If the ID appears multiple times, the latter will be "blind ". After CSS finds an element, it adds a single style. After jQuery finds the element, it adds action behavior. JQuery sub-selectors are compatible with IE6, such as: $ ('# box> p') 2. Advanced selector group selector: gets multiple DOM objects, such as $ ('span, em ,. box ') descendant selector: gets a DOM object that is traced back to multiple DOM objects, for example, $ ('ul li A') wildcard selector: gets the DOM object of all element labels, for example: $ ('*') the preceding selectors can be used in combination. The selection is more accurate and fast. The wildcard selector is rarely used, which affects performance. 3. Advanced selector subselector: obtain only multiple DOM objects of the child node, for example, $ ('div p') next selector: obtain only the DOM objects of the same level after the child node, for example: $ ('div + p') nextAll selector: gets all DOM objects of the same level after a node, such as: $ ('div ~ P ') jQuery provides an equivalent find () method for the descendant selector, for example, using ('symbol box'character .find('p'character .css ('color', 'red '); jQuery provides an equivalent children () method for the Child selector, for example, using ('character box'character .children('p'character .css ('color', 'red'); jQuery provides an equivalent next () method for the next selector, for example, question ('character box'character .next('p'character .css ('color', 'red'); jQuery provides an equivalent nextAll () method for the nextAll selector, for example, question ('color', 'red '); in addition to the advanced selector, jQuery also provides a richer Selection Method: Choice ('your box').prev('p'0000.css ('color', 'red '); // element on the same level $ ('# box '). prevAll ('P'0000.css ('color', 'red'); // all elements of the same level ('{box'}.prevuntil('p'0000.css ('color', 'red'); // encode ('color', 'red '); // select unspecified elements under the same level. If any, stop. 4. Attribute selector 5. The basic filter selector filters the required DOM elements using specific filter rules, similar to the pseudo-class syntax in CSS, it starts with a colon. The focus filter must be an element in the initial state of the webpage that has been activated for element acquisition, instead of clicking the mouse or clicking the TAB key to activate the 6. Content Filtering selector content filtering selector mainly contains child elements or text content 7. Visibility Filter

8. Child element Selector

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.