用 js 增加 style block in html

from : https://stackoverflow.com/questions/5195303/set-css-property-in-javascript

var styleBlock = document.createElement('style'),
     classes;
var blockClass

document.head.appendChild(styleBlock);
classes = styleBlock.sheet;
console.log(classes)
classes.insertRule(".dd { position:absolute; bottom:0; }");

Web / API - CSSStyleSheet.insertRule()

stylesheet.insertRule(rule[, index])

index

• 無符號整數，表示在該 CSSStyleSheet 中的順序。
• cssRules 插入之處，index 為 0 是放在最前面，
  而 index 為 max 就是最後，且與 CSSStyleSheet 的長度相同。
• 在舊的實現中，cssRules 是必需的。
• 查詢瀏覽器兼容看更多信息。
• 默認值為0。

console.log(classes)...

+ CSSStyleSheet
  cssRules : CSSRuleList {0: CSSStyleRule, length: 1 }
  disabled : false
+ href : null
+ media : MediaList {mediaText: "", length: 0 }
  ownerNode : style
  ownerRule : null
  parentStyleSheet : null
+ rules : CSSRuleList
  title : null
  type : "text/css"
+ __proto__ : CSSStyleSheet