`
deng131
  • 浏览: 661779 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

Preload CSS/JavaScript预加载

阅读更多
希望达到效果是页面第一次载入以后,如果在次刷新页或者进入下一个页面,则css,js和图片都不会再次加载。

网上代码:
window.onload = function () {
    var i = 0, max = 0,  o = null,
        // list of stuff to preload
        preload = [
            'http://tools.w3clubs.com/pagr2/<?php echo $id; ?>.sleep.expires.png',
            'http://tools.w3clubs.com/pagr2/<?php echo $id; ?>.sleep.expires.js',
            'http://tools.w3clubs.com/pagr2/<?php echo $id; ?>.sleep.expires.css'
        ],
        isIE = navigator.appName.indexOf('Microsoft') === 0;

    for (i = 0, max = preload.length; i < max; i += 1) {
        if (isIE) {
            new Image().src = preload[i];
            continue;
        }
        // new Image().src 不能在Firefox中使用,是因为Firefox会对图片执行单独的缓存。
       // 动态插入的 object 标签需要插入到非 head部分,才触发加载。
       //IE7/8也可以通过一些代码使用动态object加载文件。但是object通常降低效率。
        o = document.createElement('object');
        o.data = preload[i];

        // IE stuff, otherwise 0x0 is OK
        //o.width = 1;
        //o.height = 1;
        //o.style.visibility = "hidden";
        //o.type = "text/plain"; // IE 

        o.width  = 0;
        o.height = 0;

        // only FF appends to the head
        // all others require body
        document.body.appendChild(o);
    }
};

参考:
http://www.memonic.com/user/pneff/set/javascript/id/1pCru
http://www.joy-studio.com/frontend-develop/javascript-preload-css-js-image.html
http://www.javascriptbank.com/javascript/article/how-to/best-ways-preload-image-javascript-css-ajax/preview/en/
http://www.qianduan.net/pure-css-image-preloader.html
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics