相关疑难解决方法(0)

我正在使用几个插件,自定义小部件和一些来自JQuery的其他库.结果我有几个.js和.css文件.我需要为我的网站创建一个加载器,因为它需要一些时间来加载.如果我可以在导入所有之前显示加载器,那将是很好的:

<script type="text/javascript" src="js/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="js/myFunctions.js"></script>
<link type="text/css" href="css/main.css" rel="stylesheet" />
... 
....
 etc

我找到了几个教程,使我能够异步导入JavaScript库.例如,我可以这样做:

  (function () {
        var s = document.createElement('script');
        s.type = 'text/javascript';
        s.async = true;
        s.src = 'js/jquery-ui-1.8.16.custom.min.js';
        var x = document.getElementsByTagName('script')[0];
        x.parentNode.insertBefore(s, x);
    })();

出于某种原因,当我对我的所有文件做同样的事情时,页面不起作用.我一直在努力试图找到问题的所在,但我找不到它.首先我认为这可能是因为一些javascript函数依赖于其他函数.但是我使用超时功能以正确的顺序加载它们,当一个完成后我继续下一个并且页面仍然表现得很奇怪.例如,我无法点击链接等...动画仍然有效..

无论如何

这就是我一直在想的......我相信浏览器有一个缓存,这就是为什么第一次加载页面需要很长时间以及下次快速加载页面的原因.所以我想要做的是用一个异步加载所有这些文件的页面替换我的index.html页面.当ajax完成后,将所有这些文件重定向到我计划使用的页面.使用该页面时,加载时间不应太长,因为文件应该包含在浏览器的缓存中.在我的索引页面(异步加载.js和.css文件的页面)我不关心错误.我将只显示一个加载器并在完成后重定向页面...

这个想法是一个很好的选择吗？或者我应该继续尝试实现异步方法？

编辑

我加载所有异步的方式就像:

importScripts();

function importScripts()
{
    //import: jquery-ui-1.8.16.custom.min.js
    getContent("js/jquery-1.6.2.min.js",function (code) {
                var s = document.createElement('script');
                s.type = 'text/javascript';
                //s.async = true;
                s.innerHTML=code;
                var x = document.getElementsByTagName('script')[0];
                x.parentNode.insertBefore(s, x);
                setTimeout(insertNext1,1);
            });


    //import: jquery-ui-1.8.16.custom.min.js
    function insertNext1()
    {
        getContent("js/jquery-ui-1.8.16.custom.min.js",function (code) …