javascript - SEO 友好的解决方案，以避免出现无样式的内容

Question

我正在使用以下 JS 以一种对 SEO 友好的方式避免出现无样式的内容：

<script type="text/javascript"> 
$('#Container').addClass('fouc'); 
$(document).ready(function() { 
    $('#Container').show(); 
}); 
</script>

其中也有附带的 CSS: <style> .fouc {display:none;}</style>。

我期望发生的是，在页面加载时，我的 div #Container 至少应该在类 .fouc 添加，但是，只有当我通过控制台手动添加它时才会发生这种情况。

我是否需要一些额外的代码等才能使其按预期运行？

仅供参考，在调用此脚本之前，我已经在调用 JQuery。

感谢您的帮助！

score 1 · Accepted Answer

避免 FOUC 的最佳方法是将所有指向 CSS 文件的链接放在<head>元素中。这样样式规则将在内容之前加载，然后将被样式化。这既是 SEO 又是用户友好的。

1 回答 1