js 对于样式的操作

1.内联样式

可以直接通过style属性获取到当前元素身上的内联样式。
返回的是一个json对象。

对于样式的操作：

对象.style.样式名称（颜色，字体什么什么的）

注意：在JS中设置样式的时候，名称要把中间的连字符去掉，换成后一个字母大写。例如：background-color 要写成： backgroundColor

也可以直接通过下标获取，但是获取的是键的名字
this.style[i]

这里系统也提供了一些方法获取css属性：

1.获取css属性
对象.style.getPropertyValue(“样式名称”);
eg：

this.style.getPropertyValue(“width”);

2.删除css属性
对象.style.removeProperty(“样式名称”);

this.style.getPropertyValue(“width”);
注意：删除的名字一定是css的名字-就是连字符那种名字的。因为是原封不动的匹配

3.设置css属性
对象.style.setProperty(“样式名称”,”值”);

this.style.setProperty(“background-color”,”black”);
注意：删除的名字一定是css的名字-就是连字符那种名字的。因为是原封不动的匹配

外部样式

外部导入：
语法：

< link rel=”stylesheet” href=”css/style.css” type=”text/css”/>

1.获得总的样式集合
document.styleSheets 返回当前的文档一共有多少套样式表，一个style就是一套，一个外部导入也是一套。

 var styleType = document.styleSheets ;

2.获取到样式表集合里面的所有样式信息

/*这个[0],表示现在选取的是第一套样式表*/
 var csslist = styleType[0].cssRules;

3.获取到css样式 并设置样式表

 csslist[0].style.fontSize = "80px";

大体就这3步，记到并熟练使用即可。