jQuery addClass,removeClass,class属性增删

效果图,添加、移除class属性 

上代码:

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			.myclass {
				background-color: red;
			}
		</style>
		<script src="https://cdn.bootcdn.net/ajax/libs/jquery/2.2.0/jquery.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			function add() {
				$("#mydiv").addClass("myclass");
			}

			function remo() {
				$("#mydiv").removeClass("myclass");
			}
		</script>
	</head>

	<body>
		<pre>
			addClass、removeClass给元素添加class属性
		</pre>
		<div id="mydiv" style="border: solid;width: 200px;height: 200px;">
		</div>
		<input type="button" value="addClass" onclick="add()" />
		<input type="button" value="remoClass" onclick="remo()" />
	</body>

</html>

猜你喜欢

转载自blog.csdn.net/qq_36521848/article/details/106245873