getStyle的实现

问题：
获取元素的真实的样式。在DHTML中经常需要操作css属性，但是取值不是很方便。因为直接元素.style.属性的方式取到的是元素的style属性的值，不能得到<style>元素内的值。 

方法：
1基本情况

.1　在HTML种有三种方式定义样式。分别是link外部导入，style元素，元素的style属性
　　在DOM2 Styles中提供了一套以上的API
　　访问Style属性，必须使用驼峰法的方式

.2   获取真实style的值
　　IE下使用currentStyle。ff下使用getComputedStyle。这两种方式可以取到样式定义的三种方式混合后的最终结果。

.3   直接获取和设定整个style的值。
　　1使用getAttribute("style")或者.style返回。
　　 这种情况下。ie6/7返回object。ff在getAttribute时返回style的值，在.style时返回[cssStyleDeclaration]
　　2使用style.cssText
　　 对于style="border:1px solid".这种情况下，ff返回原始值。ie返回border-top，borde-left,border-right,border-bottom

2一些库的具体实现

1：下面看moo中的getStyle实现

    getComputedStyle: function(property){
        if (this.currentStyle) return this.currentStyle[property.camelCase()];
        var defaultView = Element.getDocument(this).defaultView,
            computed = defaultView ? defaultView.getComputedStyle(this, null) : null;
        return (computed) ? computed.getPropertyValue((property == floatName) ? 'float' : property.hyphenate()) : null;
    },

2：这里是百度tangram的实现和moo相似

baidu.dom.getComputedStyle = function(element, key){
    element = baidu.dom._g(element);
    var doc = baidu.dom.getDocument(element),
        styles;
    if (doc.defaultView && doc.defaultView.getComputedStyle) {
        styles = doc.defaultView.getComputedStyle(element, null);
        if (styles) {
            return styles[key] || styles.getPropertyValue(key);
        }
    }
    return ''; 
};

这里的以上getDocument的实现

    getDocument: function(){
        return this.ownerDocument;
    },

关于defaultView的兼容性

3自己的总结

getStyle:function(value){
if(this.currentStyle)return this.currentStyle[value];
return this.ownerDocument.defaultView.getComputedStyle(this, null).getPropertyValue(value)
}