DOM 样式调用是否受频率限制？答案

【问题标题】：Are DOM style calls limited by frequency?DOM 样式调用是否受频率限制？
【发布时间】：2011-01-21 03:52:45
【问题描述】：

我正在尝试调整 html 元素（flash 对象）的大小，但它似乎每秒响应不超过一次？

这是浏览器强加的限制吗（IE7 和 FF3 都这样做）？还是我应该尝试以不同/更有效的方式调整大小？

function setHeightNow(height) { 

    if (document.getElementById) { 
     if (height > 0) { 
      var scaleItem = document.getElementById('application'); 
      scaleItem.style.height = height + 'px'; 
           }
    } 
   }

【问题讨论】：

你怎么打电话给setHeightNow？你是循环做的吗？您需要将控制权交还给浏览器以使其在屏幕上更新。
我认为这与闪存有关。普通元素不会这样表现。

标签： javascript html dom browser

【解决方案1】：

如果您在循环中调用此函数，正如 bobince 在他/她的评论中提到的，您应该将其更改为一系列 setTimeout 调用（或 setInterval）以将控制权交还给浏览器。

类似的东西-

var i = INITIAL_VALUE;

(function() {
    setHeightNow(foo);
    if (i < FINAL_VALUE) {
        i++;
        setTimeout(arguments.callee, 0); //you can play around with the timeout.
    }
})();

还有

documents.getElementById 检查有点用处，因为所有浏览器都支持它。
如果可能，明智的做法是在此重复函数之外调用 document.getElementById。

【讨论】：

OP 更新：这仅通过 Flash 播放器 ExternalInterface.call() 调用一次，目前不在任何类型的循环中。如果我单击的频率超过 ~1 次单击/秒，则会出现此问题。根据我的测试，ExternalInterface.call() 可以尽可能频繁地到达 setHeightNow() 方法，但是“scaleItem.style.height = height + 'px';”不工作。我尝试更改的元素是否有可能被浏览器的渲染引擎锁定或仍在更新？有没有办法查看它是否“准备好”？

【解决方案2】：

这当然不是一个明确的限制；我们运行一个每秒触发 30 次的动画循环。（使用 33 毫秒超时。）大多数情况下，我们会移动背景（动画）或调整不透明度（淡入/淡出），但有时我们也会调整元素的大小。

但是，所有这些元素都是绝对定位的，或者在一个固定的容器中，所以它不会触发浏览器的重新布局。我怀疑您的问题仅仅是执行重新布局的成本，其中大部分将归结为 Flash 对象本身。

【讨论】：