网页的三个层次简单理解:
结构:html标签
样式:css样式表
行为:js及其扩展
JS控制样式:
1.找准对象
document.getElementById("");找出id为“123”的元素
document.getElementByClassName("123")[0];找出所有class为“123”的第一个元素
document.getElementByTagName("div")[0];找出所有标签名为“div”的元素
因为类名称和标签名称都是不唯一的 所以要在后面写上具体的第几个。
2.设置样式:
document.getElementById("divBg").style.width="200px";
style意思就是style样式。
width意思就是style样式里面的width属性。
200px意思就是width属性的值。
仿照如上所示的方法,我们可以更改很多内容。
在CSS中 我们写的
#divBg{backgroundcolor:red;};
相应的在js中写成
document.getElementById("divBg").style.backgroundColor="red";
如此而已。简单明了。