如何强制 WebKit 重绘/重绘以传播样式更改？

小编典典

all

我有一些简单的 JavaScript 来实现样式更改：

sel = document.getElementById('my_id');
sel.className = sel.className.replace(/item-[1-9]-selected/,'item-1-selected');
return false;

这适用于最新版本的 FF、Opera 和 IE，但在最新版本的 Chrome 和 Safari 上失败。

它影响两个后代，他们恰好是兄弟姐妹。第一个兄弟更新，但第二个没有。第二个元素的子元素也具有焦点并包含 < a>标记，该标记在 onclick
属性中包含上述代码。

在 Chrome 的“凄惨开发者工具”窗口中，如果我轻推（例如取消选中和选中） 任何元素的 任何属性，第二个兄弟姐妹将更新为正确的样式。 __

是否有一种解决方法可以轻松地以编程方式“判断”WebKit 做正确的事情？

阅读 72

2022-05-17

共1个答案

小编典典

我发现了一些复杂的建议和许多没有用的简单建议，但Vasil Dinkov对其中一个的评论提供了一个简单的解决方案来强制重绘/重绘，效果很好：

sel.style.display='none';
sel.offsetHeight; // no need to store this anywhere, the reference is enough
sel.style.display='';

如果它适用于“锁”以外的样式，我会让其他人发表评论。

2022-05-17