Correct way to create stylesheets dynamically

createStyle.js

function createStyle(styleText) {
    var style = document.createElement('style');
    style.type = 'text/css';
    
    // <style> element must be appended into DOM before setting `cssText`
    // otherwise IE8 will interpret the text in IE7 mode.
    document.body.appendChild(style);
    if (style.styleSheet) {
        style.styleSheet.cssText = styleText;
    } else {
        style.appendChild(document.createTextNode(styleText));
    }
}

一些模版会经常会用到兼容IE6、7 的 hack:

.foo {
  display: inline-block;
  *display: inline;
  *zoom: 1;
}

通过动态插入后，display: inline也会被识别，覆盖掉上面的display: inline-block。

感谢！