.hide（）。show（）在单个事件中导致重新渲染？

突击问题。如果我在单个click事件中拨打element.hide(); ....something...... element.show();，它会执行任何操作吗？我的意思是，不必要的闪烁，沉重的计算等等？为什么我需要这个？因为在我的代码中隐藏所有内容并决定显示的内容非常优雅。.hide（）。show（）在单个事件中导致重新渲染？

UPDATE：

好吧，伙计们，昨天我看着jQuery的源自己和发现（如@Msencenb说）隐藏/显示仅仅是display:none的包装。

所以我更新我的问题：请问浏览器上做一些display:block立即重新描绘和display:none重新计算，然后立即重新渲染和重新计算在一个.click(function() { ... })？或者它检测到click函数后没有任何变化，并且什么都不做？

来源

2014-11-24 Denis

找出这样的事情的最好方法是尝试一下：http://jsfiddle.net/rud9j0h7/ – dshapiro 2014-11-24 20:21:41

.hide（）事件只是添加'display'：'none'css属性的一个包装。从性能角度来看，这意味着浏览器只需要在内容再次可见时重绘它，这将高度依赖于您实际渲染的内容。 Chrome dev tools has some really cool stuff for profiling.

就不必要的闪烁而言，您应该查看回调。大多数jQuery的函数采用可选的回调函数，该函数在函数完成后运行。

$(function() { 
    $(".toggle").click(function() { 
     $(".hideme").hide(function() { 
     $(".hideme").show(); 
     }); 
    }); 
});

Here's a simple example using hide/show

来源

2014-11-25 00:09:27 Msencenb

谢谢你的信息，我更新了我的问题。 – Denis 2014-11-25 11:40:53

AFAIK浏览器不会重新绘制，直到它完成当前代码的执行。这看起来很合理，因为你可能会单独设置各种样式属性，并且不希望浏览器在所有这些中重新绘制。但是，我无法在短时间内找到任何支持此索赔的文档。

编辑：您可能想要细读this question。

来源

2014-11-25 12:00:12 hon2a

.hide（）。show（）在单个事件中导致重新渲染？

回答

相关问题