香草JavaScript路由和图像预加载

我有以下HTML部分视图作为external.HTML文件：

<div class="layout-exterior">

      <div id="carExterior" class="cars-exterior-1"></div>
      <div class="icon-360-black"></div>
      <div class="swipe-to-experience-black"></div>

</div>

在“touchmove”事件中，它改变了与当前位置相关的背景，但这不是问题所在

问题是我只能在我的公司中使用香草Javascript（没有jQuery，因此没有内置承诺），当我将其包含到main index.html模板的主容器中时，index.html中的预加载脚本将失去与脚本的绑定，这导致图像没有预加载，并且在第一次加载时会“闪烁”。试着把它们放在底部和头部，同样的结果

我使用简单的路由检查hashchange上的散列，然后加载exteriorView函数，该函数反过来通过AJAX get请求获取模板内容

现在，我正在考虑以CSS方式预加载它们；把它们精灵化掉，然后再精灵化回去，但我工作的地方是不允许的

在部分模板中包含预加载脚本仍然不起作用（将图像放入new Image（）的.src中）。使用了以下脚本：

<div class="hidden">
    <script type="text/javascript">
        <!--//--><![CDATA[//><!--
            var images = new Array()
            function preload() {
                for (i = 0; i < preload.arguments.length; i++) {
                    images[i] = new Image()
                    images[i].src = preload.arguments[i]
                }
            }
            preload(
                "http://domain.tld/gallery/image-001.jpg",
                "http://domain.tld/gallery/image-002.jpg",
                "http://domain.tld/gallery/image-003.jpg"
            )
        //--><!]]>
    </script>
</div>

---

有人知道这个问题的解决方案吗？

尝试

参数

而不是

预加载。参数

我不认为这是个问题，我的意思是函数本身递归调用，这在其他任何地方都有效，但是当我动态加载contenttry

arguments

而不是

preload.arguments

时，我不认为这是一个问题，我的意思是函数本身递归调用，这在其他任何地方都有效，但当我动态加载内容时就不行了