版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/chengxu_kuangrexintu/article/details/85543098
前言
在前面的《前端笔记44——获取或者修改div内容》和《前端笔记45——JavaScript获取和设置input的值》中，我们说的都是改变内容了，这篇博客我们来说一下设置html元素的样式。
设置html元素的样式
代码实例：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="box" style="background-color: red; height: 100px;width: 100px;"></div>
<button id="btn">点击换背景颜色</button>
<script type="text/javascript">
// 需求：点击换div背景颜色
// 1找到btn 找到box 2点击事件 3改变颜色
var oBtn = document.getElementById("btn")
var oBox = document.getElementById("box")
oBtn.onclick = function(){
// 改变背景颜色 符号‘.’可以理解为汉语‘的’
// 在CSS样式 background-color 在js中需要去掉中间的 - 把后面单词的首字母大写
oBox.style.backgroundColor = "orange"
}
</script>
</body>
</html>
上面代码中，我们通过标签id.style.属性的名称设置值就是，改变html元素的样式。