Home > Web Front-end > JS Tutorial > Analysis of CSS selector usage in Jquery_jquery

Analysis of CSS selector usage in Jquery_jquery

WBOY
Release: 2016-05-16 16:14:54
Original
2043 people have browsed it

The examples in this article describe the usage of CSS selectors in Jquery. Share it with everyone for your reference. The details are as follows:

jQuery uses a set of CSS selectors, there are 5 types in total, namely tag selector, ID selector, class selector, universal selector and group selector, which are described as follows:

1. Tag selector

is used to select existing tag elements in the HTML page, also known as element selector, format: $("element"), such as $("div"), the same as getElementByTagName

2. ID selector

is used to obtain an element with an id attribute. The format is as follows: $("id"), the same as getElementById

Copy code The code is as follows:

$("#users").val();

3. Class Selector

is used to obtain an element with a class attribute, format: $("class")

Copy code The code is as follows:

Add a border style to this text box. First, use the class attribute to bind the text box

Copy code The code is as follows:
$(".t").css("border", "2px solid blue ");

4. Universal selector

The universal selector (*) matches all elements and is mostly used to search contextually, that is, to find all tags in the HTML page, $("*")

5. Group Selector

is also called a multi-element selector, which is used to select the results of all specified selector combinations. The syntax is as follows:

Copy code The code is as follows:
$("selector1, seletor2, selector3")

For example:

Copy code The code is as follows:
$("div, span, p.styleClass"). css("border", "1px solid red");

Comprehensive example:

Copy code The code is as follows:
 
 
 
 
css选择器 
 
 
 
 
 
 

这是标题中的文本

 
 

 
 
div元素:id属性为div1.
 
 
div元素:id属性为div2.
 
 
div元素:id属性为div3.
 
 

效果图如下所示:

希望本文所述对大家的jQuery程序设计有所帮助。

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