样式属性命名——一种访问样式的简单方法
CSS样式名称和脚本中使用的名称之间存在差异，并且有些样式在不同的浏览器的表现是不一样的。CSS特性将多于一个单词的样式用连字符进行分割。JavaScript中可以使用带有连字符的样式名称，但是使用连字符就不能使用点运算符来访问样式：element.style.font-size ——这样是不被允许的。因此多个单词CSS样式名称作为属性名时，会转换为驼峰形式。 font-size 会转换为 fontSize ......
可以编写一个简单的API，在设置样式或者获取样式时自动将样式转换为驼峰形式。
<div style="color: red; font-size:10px; background-color: #eee;" ></div>
获取计算后的样式信息
测量元素的高度和宽度：height 和 width 这样的属性在不指定值的情况下，默认值为 auto ，让元素的大小根据其内容进行决定；所以如果没有显式提供特性字符串，则可以使用 offsetHeight 和 offsetWidth 来访问实际元素的高度和宽度，要注意两者获取到的值都包含padding 值。
然而如果元素的display值设置为 none时，尝试获取 offsetHeight 和 offsetWidth 的属性值，结果都是0 .
可以通过以下步骤来获取隐藏元素在非隐藏状态下的尺寸：
1、将display 属性设置为 block
2、将 visibility 设置为hidden （display 值设置为block后元素可见，为使其不可见，设置）
3、将position 设置为 absolute （visibility 设置为hidden 会导致元素位置出现空白，将position设置为 absolute 将元素移出正常可视区）
4、获取元素的尺寸
6、恢复先前修改的属性
具体代码如下：
控制台输出结果如下：