一、 在 IE 浏览器中获取元素的当前显示的样式
语法:元素 . currentStyle . 样式名
它可以用来读取当前元素正在显示的样式,如果当前元素没有设置该样式,则获取它的默认值
注意:这个方法,只兼容于 IE 浏览器,其他浏览器均不支持,如下图:
- 读取元素样式,返回的值带有单位,例如:px
- 若我们要使用读取元素样式返回的值,需取出其中的数字,即:parseInt()
- 若不设置 width / height 属性,在查询时,会返回 auto
- 若不设置 background-color 属性,在查询时,会返回 transparent
二、在其他浏览器中可以使用 getComputedStyle() 这个方法来获取元素当前的样式
这个方法是 window 的方法,可以直接使用
需要两个参数
1. 要获取样式的元素
2. 可以传递一个伪元素,一般都传 null
该方法会返回一个对象,对象中封装了当前元素对应的样式,可以通过对象 . 样式名来读取样式,但是该方法不支持 IE8 及以下的浏览器
- 读取元素样式,返回的值带有单位,例如:px
- 若我们要使用读取元素样式返回的值,需取出其中的数字,即:parseInt()
- 若不设置 width / height 属性,在查询时,会根据窗口的尺寸,返回相应的值
- 在查询 background-color 属性时,会返回对应的 rgb 值
- 若不设置 background-color 属性,在查询时,会返回 rgba(0, 0, 0, 0)