<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
div {
width: 100px;
border: 1px solid #7cd1f9;
margin: 100px auto;
}
.newClass {
color: #6db8ff;
font-size: large;
background-color: #999999;
margin-top: 100px;
}
</style>
</head>
<body>
<div class="first">文本</div>
<script>
var test = document.querySelector('div');
test.onclick = function () {
// 下面方法较麻烦
/*this.style.backgroundColor='purple';
this.style.color='#fff';
this.style.fontSize='25px';
this.style.marginTop='100px';*/
this.className = 'first newClass';
}
</script>
</body>
</html>
通过修改指向的类的方式修改样式
最新推荐文章于 2022-06-27 09:51:31 发布