在Web开发中，经常需要获取元素的样式值来进行一些动态的样式调整或计算。原生JavaScript提供了多种方法来获取元素的样式值，下面将详细介绍五种常用的方法。
方法一：使用element.style属性
element.style属性可以访问元素的样式属性。这种方法简单直接，适合获取内联样式。
// 获取内联样式
var element = document.getElementById('myElement');
var style = element.style.color; // 返回 'red'
// 获取非内联样式
var computedStyle = window.getComputedStyle(element);
style = computedStyle.color; // 返回实际应用的颜色值
方法二：使用window.getComputedStyle()方法
window.getComputedStyle()方法可以获取元素所有最终应用的内联样式和CSS规则计算后的样式值。
var element = document.getElementById('myElement');
var style = window.getComputedStyle(element);
var color = style.color; // 返回实际应用的颜色值
方法三：使用element.currentStyle属性（仅IE）
element.currentStyle属性在IE浏览器中可以获取元素的当前样式，包括内联样式和CSS规则计算后的样式值。
var element = document.getElementById('myElement');
var style = element.currentStyle.color; // 返回实际应用的颜色值
方法四：使用document.defaultView.getComputedStyle()方法
这种方法与window.getComputedStyle()类似，但是使用document.defaultView来获取getComputedStyle()方法。
var element = document.getElementById('myElement');
var style = document.defaultView.getComputedStyle(element);
var color = style.color; // 返回实际应用的颜色值
方法五：使用CSS规则匹配
使用CSS规则匹配可以获取特定选择器的样式值。
var style = window.getComputedStyle(document.body, ':after');
var color = style.color; // 返回 ':after' 伪元素的颜色值
以上就是获取元素样式值的五种实用方法。在实际应用中，可以根据具体需求选择合适的方法。需要注意的是，window.getComputedStyle()和element.currentStyle在IE浏览器中有所不同，因此在编写兼容性代码时需要考虑这一点。