HTML5之classList

最新推荐文章于 2025-07-31 10:23:03 发布

原创最新推荐文章于 2025-07-31 10:23:03 发布 · 388 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#html5 #classList

收录于

本文介绍了HTML5中新增的classList属性及其使用方法。通过实例演示了如何利用classList的add、remove和toggle方法来动态地为元素添加、移除或切换CSS类。

HTML5的新增属性classList。

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<div id="test" class="class1 class2 class3">
		
	</div>
		
</body>
<script type="text/javascript">
	var test = document.querySelector("#test")
	test.classList.add("class4")
	test.classList.remove("class1")
	test.classList.toggle("class1")
	console.log(test.classList)
</script>
</html>

通过debugger 监听test 可以看到classList集合