2009-04-11

动态创建 style 节点

在 IE 中 DOM 方式创建页面内 style 节点有点问题~ (创建出来的东西是不能修改内容的)
可用 document.createStyleSheet() 来解决:

// create style node
var _styleNode = _(u.STYLE_ID);
if (!_styleNode) {
 if (/*@cc_on!@*/0) { // is IE
  var ss = document.createStyleSheet();
  ss.cssText = _defaultStyleText;
  _styleNode = ss.owningElement; // the style node just created
  _styleNode.id = u.STYLE_ID;
 } else { // other browsers
  _styleNode = document.createElement("style");
  _styleNode.id = u.STYLE_ID;
  _styleNode.type = "text/css";
  _styleNode.innerHTML = _defaultStyleText;
  var head = document.getElementsByTagName("head")[0] || document.body;
  head.appendChild(_styleNode);
 }
}

另外,对于 link 引入 css 可用:
document.createStyleSheet("style.css");
对应:
var style = document.createElement("link");
style.href = "style.css";
style.rel = "stylesheet";
style.type = "text/css";
document.getElementsByTagName('head')[0].appendChild(style);

//EOF

0 comments: