学步园

可以点以下链接看原先的实现与讨论。本版本主要修bug与通过缓存一些对象提高效率：

《动态添加样式表规则》，《再谈动态添加样式规则》

//2011.3.6 by 司徒正美
      ;;;(function(WIN,DOM){
        this.dom = this.dom || {};
        var reg_media = /screen|all/i, reg_opacity = /opacity:\s*(\d?\.\d+)/g
        dom.addSheet = function(css , appendTo){
          var self = arguments.callee,style ,el = appendTo || DOM.body
          if(!self.style){
            var styles = DOM.getElementsByTagName("style"), i = 0, media
            while(style = styles[i++]){
              media = style.getAttribute("media");
              if(media === null || reg_media.test(media)){
                self.style = style;
                break;
              }
            }
            if(!self.style){
              style = DOM.createElement('style');
              el.appendChild(style);
              self.style = style;
            }
          }
          if(!-[1,] && el.filters){//IE6-8
            css = css.replace(reg_opacity,function($,$1){
              $1 = parseFloat($1) * 100;
              if($1 < 0 || $1 > 100)
                return "";
              return "filter:alpha(opacity="+ $1 +");"
            });
          }
          css += "\n";//增加末尾的换行符，方便在firebug下的查看。
          if(style.styleSheet){    //ie
            style.styleSheet.cssText += css;//添加新的内部样式
          }else if(WIN.Components){
            style.innerHTML += css;//火狐支持直接innerHTML添加样式表字串
          }else{
            style.appendChild(DOM.createTextNode(css))
          }
        }
      })(this,this.document)

使用方法：

   dom.addSheet("body{background:#666;color:#fff;}")

var addCSS = (function(){
	var style = document.createElement('style');
	style.type = 'text/css';
	var root = document.getElementsByTagName('head')[0] || document.body;
	root.appendChild(style);
	return function(css){
		style.appendChild(document.createTextNode(css+'\n'));
	};
})();