gpt4 book ai didi

twitter - 什么是 data-fouc-class-names ="swift-loading"?

转载 作者:行者123 更新时间:2023-12-01 03:54:10 25 4
gpt4 key购买 nike

我注意到 Twitter 源代码顶部附近的以下内容:

data-fouc-class-names="swift-loading"

一个快速的谷歌搜索出现了一些使用它的其他网站,但我找不到任何描述它的用途的东西。让它成为如此受欢迎的网站的标记(由于 conditional HTML classes 被使用而多次启动)必须使它对某些东西有用。

我熟悉“flash of unstyled content”又名“FOUC”的概念,但我很好奇这段代码具体与什么相关。

最佳答案

如果您查看第 38-40 行,您会得到

<script id="swift_loading_indicator">
document.documentElement.className=document.documentElement.className+" "+document.documentElement.getAttribute("data-fouc-class-names");
</script>

这会更改文档元素类以包含此属性中设置的值。

这允许 css 在页面和 javascripts 加载时隐藏“无样式内容的 Flash”。

稍后脚本会删除此类以允许加载完全加载的页面。

它似乎也用于 ajax 页面加载代码中,以允许内容加载隐藏,并且仅在加载所有内容后才显示。

以名称 data- 开头的属性是 html 5 规范的一部分,代表私有(private)数据。它们允许网页在网页中存储信息,而不会破坏通过 HTML5 验证器的验证

关于twitter - 什么是 data-fouc-class-names ="swift-loading"?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18867559/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com