用.innerText缓慢更新样式表的内容

问题描述

我有一个样式表我正在更新的内容，在飞行，基于用户UI。我注意到，在Firefox（使用stylesheet.innerHTML）和IE（使用stylesheet.styleSheet.cssText）工作得很好。

I have a stylesheet I'm updating the contents of on the fly, based on a user UI. I noticed that in Firefox ( which uses stylesheet.innerHTML ) and IE ( which uses stylesheet.styleSheet.cssText) works well.

Chrome和Safari（使用stylesheet.innerText）似乎在大型样式表上运行速度非常慢。有没有人遇到这个和/或找到更好的解决方案？

It seems that Chrome and Safari ( which use stylesheet.innerText ) run incredibly slow on larger stylesheets. Has anyone run into this and/or found better solutions?

编辑：
不可能使用JS来更改内联样式因为应用程序从不刷新，并且用户可以切换页面，从而阻止内联样式。如果我想使用UI修改链接，我不能使用内联修改伪类，如：hover（据我所知）

It's not possible to use JS to change inline styles since the application never refreshes and the user can switch "pages" thereby nuking the inline styles. Also if I want to use the UI to modify links, I can't use inline to modify pseudo classes such as :hover ( as far as I know )

推荐答案

所以这是我过去一年左右更新样式表的函数：

So this has been my function for updating stylesheets for the past year or so:

function(style, style_value) {

  if ('cssText' in style.styleSheet) {

    // without this line, IE WILL crash, if no stylesheet settings were set
    if ( typeof(style_value) != 'string' || !style_value.length) {
      return;
    }
    style.styleSheet.cssText = style_value;

  }
  else {
    style.innerHTML = style_value;
  }

}

这篇关于用.innerText缓慢更新样式表的内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！