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

DOM-设置样式

2016-03-01 23:48 447 查看
<!DOCTYPE html>
<html>
<head>
<title> new document </title>
<meta charset="utf-8" />
<style>
#d1{
width:100px;
height:100px;
background-color:red;
}

.test{
background:yellow;
}
</style>
<script>
function changeStyle(){
//1、获取样式表对象
var sheets = document.styleSheets;
var sheet = sheets[0];
//2、获取 sheet 中所有的样式规则
var rules = sheet.rules;
//3、获取 某一具体规则
var rule = rules[0];
console.log(rule);
//4、设置 属性
rule.style.backgroundColor="yellow";
}
</script>
</head>

<body>
<button onclick="changeStyle()">设置样式</button>
<div id="d1"></div>
</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: