Home > Web Front-end > Front-end Q&A > How to remove multiple classes in jquery

How to remove multiple classes in jquery

青灯夜游
Release: 2022-04-27 18:30:19
Original
5384 people have browsed it

In jquery, you can use the removeClass() method to remove multiple classes. You only need to pass the class name as a parameter to the method. The syntax is "$(selector).removeClass("class name List ")", multiple class names are separated by spaces; if the parameter is omitted, all classes will be removed.

How to remove multiple classes in jquery

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

In jquery, you can use the removeClass() method to remove multiple classes.

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

Syntax:

$(selector).removeClass(class)
Copy after login
ParametersDescription
class

Optional. Specifies the name of the class to be removed.

If you need to remove several classes, please use spaces to separate class names.

If this parameter is not set, all classes will be removed.

If the removeClass() method does not specify parameters, this method will remove all classes from the selected elements.

Example 1: Remove multiple classes

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-1.10.2.min.js"></script>
		<script>
			$(function () {
            $("button").click(function () {
                $("p").removeClass("intro1 intro2");
            })
        })
    </script>
		<style type="text/css">
			.intro1 {
				font-size: 120%;
			}
			.intro2 {
				color: red;
			}
			.intro3 {
				background-color:pink;
			}
		</style>
	</head>
	<body>
		<h1>一个大标题</h1>
		<p class="intro1 intro2 intro3">一个p段落</p>
		<p>另一个p段落</p>
		<button>从第一个p元素中删除多个class</button>
	</body>
</html>
Copy after login

How to remove multiple classes in jquery

##Example 2: Remove all classes

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-1.10.2.min.js"></script>
		<script>
			$(function () {
            $("button").click(function () {
                $("p").removeClass();
            })
        })
    </script>
		<style type="text/css">
			.intro1 {
				font-size: 120%;
			}
			.intro2 {
				color: red;
			}
			.intro3 {
				background-color:pink;
			}
		</style>
	</head>
	<body>
		<h1>一个大标题</h1>
		<p class="intro1 intro2 intro3">一个p段落</p>
		<p>另一个p段落</p>
		<button>从第一个p元素中删除多个class</button>
	</body>
</html>
Copy after login

How to remove multiple classes in jquery

[Recommended learning:

jQuery video tutorial, web front-end video]

The above is the detailed content of How to remove multiple classes in jquery. 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