Get the App
SLTechnology News&Howtos  ›  Development  › 

How jquery modifies the css class

Shulou Source: shulou.com Published: 2022-05-31 20:24:14 09月21日 Update

Most people do not understand the knowledge points of this article "jquery how to modify css class", so the editor summarizes the following content, detailed content, clear steps, and has a certain reference value. I hope you can get something after reading this article. Let's take a look at this "jquery how to modify css class" article.

Modify the method: 1, use attr () to set the class attribute value, modify the css class name, syntax "element object .attr (" class "," new class ")"; 2, remove the old class and add a new css class, syntax "element object .removeClass (" old class name "). AddClass (" new class name ")".

The operating environment of this tutorial: windows7 system, jquery1.10.2 version, Dell G3 computer.

Jquery's method of modifying the css class

Method 1: use attr () to set the class attribute value and modify the css class name

$(document) .ready (function () {$("button") .click (function () {$("p"). Attr ("class", "intro2");}) .intro1 {font-size: 20px; color: red;} .intro2 {font-size: 30px Color: peru;} this is a headline and this is a paragraph.

Modify the css class

Method 2: remove the old class using removeClass () and add the new css class with addClass ()

The removeClass () method removes one or more classes from the selected element.

The addClass () method adds one or more classes to the selected element. This method does not remove the existing class attribute, but simply adds one or more class attributes.

$(document) .ready (function () {$("button") .click (function () {$("p"). RemoveClass ("intro2"). AddClass ("intro1");}) .intro1 {font-size: 20px; color: red;} .intro2 {font-size: 30px Color: peru;} this is a headline and this is a paragraph.

Modify the css class

The above is about the content of this article on "how jquery modifies the css class". I believe we all have a certain understanding. I hope the content shared by the editor will be helpful to you. If you want to know more about the relevant knowledge, please follow the industry information channel.

Tags: Method content element attribute class name this is multiple object article title paragraph knowledge article grammar value most that is tutorials more steps Apple Docker Huawei Linux macOS MariaDB Microsoft MySQL NVidia OPPO Reno Docker Shulou Technology MySQL OPPO Reno Huawei