Question

我目前希望通过确保在javascript之前下载公司徽标来改善对Web应用程序的感知。

为此，我将javascript引用移到公司徽标的img元素下面。

例如：

<img src="/Images/Logo.jpg" alt="My Company"/>
<script type="/Scripts/MyScripts.js"></script>

在查看Google Chrome开发者工具时，我可以看到徽标的调用已经发出，但它仍然是＆＃34;等待＆＃34;直到页面上的所有javascript都已下载。

为什么会这样？如何确保在javascript之前加载公司徽标？

Answer 1

如果您正在使用jQuery，请尝试使用$(window).load作为脚本。

$( window).load(function() {
    //put js code here
});

根据this site：

当完整页面出现时，窗口加载事件会稍后执行满载，包括所有帧，对象和图像。因此应放置与图像或其他页面内容有关的功能在窗口或内容标记本身的加载事件中。

对于您必须使用<script src='path/to/file'>添加到网站的单独文件，我建议您使用$.getScript。

$.getScript("path/to/file");

以下是$.getScript manual。

Answer 2

在HTML标记解析期间，浏览器必须立即下载并执行JS文件（至少由于脚本中可能使用document.write）。

最好的解决方案之一是添加onload事件处理程序，在页面准备就绪时动态加载脚本：

<script type="text/javascript">
window.addEventListener("load",function () {
    var elem = document.createElement("script");
    element.src = "file.js";
    document.body.appendChild(element);
, false);
</script>

如何在javascript之前加载图片

2 个答案: