Jquary Tutorial 2:jquery Selector

1 What is a jquery selector

Gets the page element and wraps the page element as a jquery object

2Why you should learn jquery selector

To make it easier to get the elements on the page and wrap the elements, it makes it easier for us to write programs.

3What are the common jquery selectors?

called	usage	Description
ID Selector	$ ("#id");	Gets the element with the specified ID
Class Selector	$ (". Class");	Get elements of the same class
Tag Selector	$ ("div");	Get all elements of the same class of labels
and set Selector	$ ("Div,p,li");	Use commas to separate, as long as one of the criteria is met. Get all Div, p, Li elements
Intersection selector (label-specific selector)	$ ("Div.redclass");	Note that there is no space between selector 1 and selector 2, the DIV element class is redclass, and the descendant selectors are distinguished.

called	usage	Description
Descendant Selector	$ ("Ul>li");	Use the > number to get the elements of the son hierarchy, note that the elements of the grandchild hierarchy are not acquired
Descendant Selector	$ ("ul Li");	Use spaces to represent descendant selectors, get all LI elements under UL, including grandchildren, etc.

Filter selector (method)

Note: The selector above is differentiated by the incoming string, and the filter selector is a method

name	usage	Description
Children (selector)	$ (' ul '). Children (' Li ')	Find all the immediate child elements of your own qualifying <br/> Current in the descendant selector $ ("Ul>li");
Find (selector)	$ (' ul '). Find (' Li ')	Find all of your eligible descendant elements <br/> Current in descendant selector $ ("ul Li");
Siblings (selector)	$ ("#first"). Siblings ("Li");	Find sibling elements, not including yourself.
Parent ()	$ ("#first"). Parent ();	Find Direct Father Element
EQ (Index)	$ ("li"). EQ (2);	Find all eligible Li within the corresponding subscript element, index starting from 0
Next ()	$ (' #first '). Next ()	Next brother.
Index ()	$ (' li '). Index ()	Returns the corresponding index

Filter Selector

name	usage	description
: EQ (Index)	$ ("Li:eq (2)")	Gets to the Li element, selecting an element with index number 2, index number starting from 0.
: Odd	$ ("li:odd")	Get to the LI element, select an element with an odd index number
: Even	$ ("Li:even")	Get to the LI element, select an element with an even number of index numbers

4Version Introduction

4-1 jquery Large version is divided into 1.x and 2.x and 3.x differences: 2.x 3.x version no longer supports IE6/7/8

4-2 about jquery3.0: Turn over the introduction of the official website:

JQUERY3.0 is now released, and the goal is to create a slimmer, faster version of jquery (and backwards compatibility). We've removed the old version of IE's solution and brought some more modern web APIs, but that makes sense. 3.0 is a continuation of the 2.x branch, but there are some groundbreaking changes. However, the 1.12 and 2.2 branches will continue to receive critical support patches at the same time. But they won't have any new features or major revisions. JQuery3 is the future of jquery, and if you need compatible ie6-8, you can continue to use version 1.12.

4-3 jquery Each version is also divided into compressed and uncompressed versions:

jquery.js: Uncompressed version (development version), code readability, recommended for use in the development and learning phase, easy to view the source code.

Jquery.min.js: Compressed version, remove comments, line breaks, spaces, and replace some variables with simple characters such as a,b,c, basically no readability, recommended in the project production environment, because the file is small, reduce network pressure.

Jquary Tutorial 2:jquery Selector