您的位置：首页 > Web前端 > CSS

利用calssName给元素修改样式

2016-06-23 21:25 309 查看
之前是用DOM style 方式给元素设置或者刷新样式，可以利用元素的className属性设置元素的样式。

如：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style type="text/css">
.demo1{
color:#F00;
}
.demo2{
background-color:#066;
}
</style>
</head>

<body>
<h1 id="test" class="demo1">how are you?</h1>
<script>
var m=document.getElementById("test");
m.className="demo2";
</script>
</body>
</html>


如果给元素追加新发的样式，则可这样：

var m=document.getElementById("test");
m.className+=" demo2";


注意demo2前面是有空格的，在一个元素应用两个样式的时候一般中间用空格隔开，因此新添加的样式前面需要加上空格，好加以区分。
还可以用addClass()函数

addClass(m,"demo2");
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航