html添加样式js,前端-JS设置html元素样式

在前面的[《前端-获取或者修改div内容》]和[《前端-JavaScript获取和设置input的值》]中，我们说的都是改变内容了，这篇博客我们来说一下设置html元素的样式。

设置html元素的样式

代码实例：

点击换背景颜色

// 需求：点击换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"

}

上面代码中，我们通过标签id.style.属性的名称设置值就是，改变html元素的样式。