Home > Web Front-end > JS Tutorial > What selectors does jquery have? Introduction to jquery's four selectors

What selectors does jquery have? Introduction to jquery's four selectors

不言
Release: 2018-08-16 11:05:37
Original
7872 people have browsed it

How many types of jquery selectors are there? I believe you may know something about it, so what this article brings to you is a brief introduction to what jquery selectors are and what jquery selectors are. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you. Helps.

1: The role of the selector

Get the tag elements above the web page, etc., and then perform a series of operations on them (add styles, add behaviors... .)

2: What are the selectors?

Basic selector, hierarchical selector, filter selector, form selector

1: Basic selector
The basic selector is the most commonly used selector in jquery, and it is also the simplest selector. It searches for
DOM elements through element id, class, and tag name (in the web page, the ID is only It can be used once, the id is unique, but the class is allowed to be used repeatedly)

1. ID selector

Usage: $("#id name"); Return a collection of single elements

2, class (class selector)

Usage: $(".class"); Return collection elements

Explanation: .class is the style name

3. element (label selector)

##Usage: $("span,p,p") ; Return collection elements

4, $("*"): Return collection elements, match all elements

2: Hierarchical selector

1: parent child: ancestors and descendants

3: Filter selector

Basic filter selector (also the most commonly used Filter selector)

:not(select)

Usage: $(input:not(select)) Returns the collection elements

Description: Remove all elements with Elements matched by the given selector. Somewhat similar to "non"

:first Find the first element

:last Find the last element

:odd Match the element whose subscript is the base

:even Matches elements with even subscripts

:eq("subscript") Matches elements with specified subscripts

:gt("subscript") Matches index values ​​greater than the given Subscripted elements (excluding itself)

:lt("subscript") Matches elements whose index value is less than the given index value (excluding itself)

Content filter selector

: contains ("text content") Whether the matching element contains the specified text content

: has (label element) //Match elements that contain the element matched by the selector

:empty //Match elements whose content is empty


:parent //Match elements that contain child elements or text

Attribute filter selector

[attribute=value]: The attribute filter selector is to obtain the corresponding element through the attribute of the element.

For example:

$("input[name='chk']").attr("checked", true);
Copy after login

--It is the complex name of chk. The checked box returns a collection

The attribute is changed to true

Visibility filter selector

: hidden Filter hidden elements (type= "hidden",css: display="none")

: visible Filter visible elements

Sub-element filter selector

:nth- child(index/even/odd/equation)

Note: The index value here starts from 1, and eq starts from 0

: first-child Find the first child element

:last-child Find the last child element

:only-child Match elements with only one child element

Form object attribute filter selector

: disabled Filters unavailable elements

: enabled Filters available elements

: checked Filters selected check boxes

: selected Filter drop-down box is selected The element

DOM operation is to add, delete, modify and check elements

Related recommendations:

Introduction to jquery selector

jquery selector (commonly used selector description)_jquery

Detailed summary of JQuery selector special edition_jquery

The above is the detailed content of What selectors does jquery have? Introduction to jquery's four selectors. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template