IE6/7 setattribute 설정 스타일 지원하지 않음/getattribute 설정 스타일 속성 값 가져오기 지원하지 않음

IE6/7에서는 setattribute를 통해 요소의 스타일 속성을 설정할 수 없고 getattribute를 통해 요소의 스타일 속성 값을 가져올 수 없습니다.이것은 스타일 대상을 가져옵니다.
아래와 같다

<div style="color:blue">div test</div>
<script type="text/javascript">	
	var div1 = document.getElementsByTagName('div')[0];
	
	//   style   
	var val = div1.getAttribute('style');
	alert(val);	
</script>	

 
IE8/9/Firefox/SAfari/Chrome/Opera: "color:blue"팝업
IE6/7: style 객체인 [object]입니다.
 
또한

<div style="color:blue">div test</div>
<script type="text/javascript">
	var div1 = document.getElementsByTagName('div')[0];
	
	//    style
	div1.setAttribute('style', 'color:red');
</script>

 
IE8/9/Firefox/SAfari/Chrome/Opera: div 텍스트 색상은 빨간색
IE6/7: 변경되지 않은 파란색
 
이를 감안하여 방법 setattr/getattr는 스타일에 대한 처리를 다음과 같이 늘려야 한다.

/**
 *
 * DOM util
 * Version:  0.1
 * Author: snandy
 * Blog: http://snandy.cnblogs.com
 *
 * 1,       name
 * 2, IE6/7      class, for   
 * 3, IE6/7 style    cssText
 * 
 */

dom = (function() {
	
	var fixAttr = {
		tabindex: 'tabIndex',
		readonly: 'readOnly',
		'for': 'htmlFor',
		'class': 'className',
		maxlength: 'maxLength',
		cellspacing: 'cellSpacing',
		cellpadding: 'cellPadding',
		rowspan: 'rowSpan',
		colspan: 'colSpan',
		usemap: 'useMap',
		valign: 'vAlign',
		frameborder: 'frameBorder',
		contenteditable: 'contentEditable'
	},
	
	p,
	
	div = document.createElement( 'div' );
	
	div.innerHTML = '<p style="color:red;"></p>';
	div.setAttribute('class', 't');
	
	p = div.getElementsByTagName('p')[0];
	
	var 
		// http://www.cnblogs.com/snandy/archive/2011/08/27/2155300.html
		setAttr = div.className === 't',
	
		// http://www.cnblogs.com/snandy/archive/2011/03/11/1980545.html
		cssText = /;/.test(p.style.cssText);
	
	var special = {
		style : {
			get: function( el ) {
				var txt = el.style.cssText;
				if(txt) {
					txt =  cssText ? txt : txt + ';';
					return txt.toLowerCase();
				}
			},
			set: function( el, value ) {
				return (el.style.cssText = '' + value);
			}	
		}
	};
	
	
	return {
		
		support : {
			setAttr : setAttr,
			cssText : cssText
		},
		
		setAttr : function(el, name, val) {
			if(setAttr) {
				el.setAttribute(name, val);
				return val;
				
			}else {
				if(special[name]) {
					return special[name].set(el, val);
					
				}else {
					el.setAttribute(fixAttr[name] || name, val);
					return val;
				}
			}
			
		},
		
		getAttr : function(el, name) {
			if(setAttr) {
				return el.getAttribute(name);
				
			}else {
				if(special[name]) {
					return special[name].get(el);
					
				}else {
					return el.getAttribute(fixAttr[name] || name);
				}
			}
			
		}
		
	
	}
})();