Rails帮助从底部更快地加载javascript

问题描述

| 我有一个问题，我有一些显示Flexibg图片的JavaScript。仅在页面底部时有效。就在之前问题是该javascript被加载为最后一个。而且我可以看到flexi bg图像只是难以实现。我的代码：

<%= javascript_include_tag \'flexibg.js\' %>
</body>

我该怎么做才能使flexi bg javascript首先或更快地加载？编辑：我将javascript放在了我的body标签顶部，并且仍然可以使用。但这慢得要命。

解决方法

好的，要了解您的问题，您需要对页面的加载方式有基本的了解。简短的解释（不是100％准确，但是足够好）是浏览器从页面的第一行开始逐行运行。当它命中每个脚本标签时，将对其进行加载（并且直到完成后才继续移动到其余行，这就是为什么将脚本标签放在底部被认为是最佳做法）的原因。一旦浏览器（在其看来）具有足以值得渲染的值，它就会开始渲染它所拥有的内容。这很可能是造成您问题的原因：浏览器最初加载的图片尺寸错误，并且只有当JS加载/运行时，才设置正确的尺寸。要解决此问题，您要做的是首先隐藏整个页面，然后在页面加载后显示它。基本上，您想采取以下措施：

<script src=\"yourFile.js\"/> <!-- This could go at the end -->
<body id=\"theBody\" style=\"display:none\"> <!-- rest of document --></body>
<script>document.getElementById(\"theBody\").style.display = \"\";</script>

这样，浏览器将点击BODY标签和后续内容，但是由于display：none样式，它不会呈现任何内容。然后，当浏览器结束时，它将命中script标记，从而删除display：none样式，从而显示页面。那只是一个简单的例子，可能有一些细节不正确（例如，我认为在body标签之后不允许使用脚本标签），但希望您能理解。如果没有，请发表评论，我将尝试进一步解释。

javascript rails rails rails 加载加载加载帮助帮助底部底部更快更快