Home > Web Front-end > Front-end Q&A > How to remove a class in jquery

How to remove a class in jquery

青灯夜游
Release: 2022-04-20 19:38:09
Original
10047 people have browsed it

Removal method: 1. Use removeClass() to remove the specified class from the selected element, the syntax is "element object.removeClass(class name)"; 2. Use removeAttr() to remove the class attribute from the element. , the syntax "element object.removeAttr("class")".

How to remove a class in jquery

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

jquery removes a class

Method 1: Use removeClass()

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

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

Note: If no parameters are specified, this method will remove all classes from the selected elements.

Example:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-1.10.2.min.js"></script>
		<script>
			$(document).ready(function(){
				$("button").click(function(){
				  $("p:first").removeClass("intro");
				});
			});
			</script>
		<style type="text/css">
			.intro {
				font-size: 120%;
				color: red;
			}
		</style>
	</head>
	<body>

		<h1>这是一个段落标题</h1>
		<p class="intro">这是一个段落</p>
		<p> 这是另外一个段落</p>
		<button>移除p元素的 "intro" 类</button>

	</body>
</html>
Copy after login

How to remove a class in jquery

Method 2: Use removeAttr()

removeAttr() method to select from Remove attributes from the element.

You only need to use this method to remove the class attribute from the selected element to remove the class

$(selector).removeAttr("class")
Copy after login

Example:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-1.10.2.min.js"></script>
		<script>
			$(document).ready(function(){
				$("button").click(function(){
				  $("p:first").removeAttr("class");
				});
			});
			</script>
		<style type="text/css">
			.intro {
				font-size: 120%;
				color: red;
			}
		</style>
	</head>
	<body>

		<h1>这是一个段落标题</h1>
		<p class="intro">这是一个段落</p>
		<p> 这是另外一个段落</p>
		<button>移除p元素的 class</button>

	</body>
</html>
Copy after login

How to remove a class in jquery

[Recommended learning: jQuery video tutorial, web front-end video]

The above is the detailed content of How to remove a class 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