Javascript 搜索引擎优化友好的解决方案，以避免未格式化的内容一闪而过

我使用以下JS以避免以SEO友好的方式闪现未定型的内容：

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

$（'#Container'）.addClass（'fouc'）；
$（文档）.ready（函数（）{
$（“#容器”）.show（）；
}); 

它还有附带的CSS:

.fouc{display:none；}

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

我需要一些额外的代码等，以使其功能如预期

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

---

谢谢你的帮助

避免FOUC的最佳方法是将指向CSS文件的所有链接都放在

元素中。这样，样式规则将在内容之前加载，然后对内容进行样式设置。这既是SEO又是用户友好的。

此代码需要立即放在#Container元素之后才能生效，但是，它可能无法完全摆脱FOUC。100%摆脱它的唯一方法是预先设置元素的样式（直接添加类而不是使用js），或者使用内联css隐藏它们。您在哪个浏览器中看到了这一点？我认为这相当于IE的古老版本，只要你的CSS链接在它们应该在的地方（在

头部

），那么这在今天的浏览器中就不是问题。（事实上，我认为这从来不是一个问题……这只是它们的工作方式）不管你的操作系统/浏览器有多新，一台速度慢的电脑仍然经常会有FOUC。@KevinB是真的，不过我会说这只是一个不用担心它的理由。这只是一些浏览器的工作方式。这取决于您添加的预样式。到底是什么导致了FOUC？您是否使用javascript将类添加到html中？图像加载速度不够快吗？其中一个问题是，我使用的是脚本，但是，当没有缓存任何内容时，它经常被呈现为这样。上面的第二个链接是我试图用这个FOUC解决方案避免的！看，这是一个js问题。我没有发现任何seo问题，通过在图像中添加适当的类来预先设置滑块的样式，这会导致除第一个之外的所有图像都被隐藏。是的，这不是CSS的问题，但你必须等待JS完成所有的样式设置。作为开发人员，这对您来说很方便，但确实引入了FOUC。在这里，预拉伸可能是最好的选择。这是一个好主意@Kevin B。这将是一个尝试。