加载时元素闪烁

Question

正如您在此处看到的 ( https://a.cl.ly/X6ue19zD ) No Advisory 面板在加载时会短暂闪烁。 当有活跃的建议时，面板应该隐藏并且最终会隐藏，但是我怎样才能阻止它在加载时闪烁？

Answer 1

在你的 css

[data-cloak]{
      display:none !important;
}

在 javascript

document.addEventListener("DOMContentLoaded", () => {
        var cloaks = document.querySelectorAll("[data-cloak]");
        cloaks.forEach((el)=>{
            el.removeAttribute('data-cloak')
        });
    });

通过向该元素添加data-cloak属性来解决您想要的任何元素上的闪烁问题，例如

<div class="yours-advisory-element-classes" data-cloak>
    ....
</div>