原⽣JavaScript（JS）修改添加CSS样式表（更好的性能）如要增加⼀个 CSS
body {
overflow: hidden;
}
低性能⽅案
⽹络⼀般流传的都是：通过操作 DOM 的style 属性来简洁改变 CSS 的⽅法
但有⾁眼可见的延迟（在后⾯加个过渡动画你就知道）
document.querySelector("body").style.overflow= "hidden";
⾼性能⽅案
但是其实有⼀种直接操作 CSS 的⽅法
这种性能⽐第⼀种要好到不知哪⾥去，⾁眼感觉不到延迟
insertRule 函数代码⽰例
var css0 = document.styleSheets[0];
css0.insertRule("body {overflow: hidden;}", css0.rules.length);
注： insertRule() 最后的参数是 Index, 值为 0 时表⽰放在样式表的最前⾯（最前⾯的样式会被后⾯的样式效果覆盖，所以推荐写 css0.rules.length）
所以样式排序稍微⿇烦点，但你可以很轻松地想出办法定位的。
更多⽤法，⾃⼰把 css0 打印出来就知道了，我只是搞后端的，你问我我也不懂。
效果
在来个⽰例1
⽰例2（添加到CSS表的最后，优先级最⾼）
css样式表优先级最高⽰例3（在最后⼀个CSS表的末尾添加，优先级MAX？，但速度最慢，因为要等前⾯CSS解析完）
// CSS0
var css= document.styleSheets;
var css0 = css[css.length-1];
var css0Last = css0.cssRules.length;
css0.insertRule("body {overflow: hidden;}", css0Last+0);
css0.insertRule("div#loading, a[name=top] {  background-color: #f0f0f0;  z-index: 1099; position: fixed; }", css0Last+1);
css0.insertRule("#header,#leftcontentcontainer,#profile_block,.catListTitle,#comment_nav{display:none!important}", css0Last+2);

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。