最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Lazy load css with js - Stack Overflow

programmeradmin7浏览0评论

If i use something like this to lazy load some of my css files, is it possible to add 2 css files into it or can it only load 1?

<script>
var cb = function() {
            var l = document.createElement('link'); 
            l.rel = 'stylesheet';
            l.href = 'yourCSSfile.css';
            var h = document.getElementsByTagName('head')[0]; 
            h.parentNode.insertBefore(l, h);
         };

var raf = requestAnimationFrame || mozRequestAnimationFrame ||
          webkitRequestAnimationFrame || msRequestAnimationFrame;

if (raf) { 
   raf(cb) 
} else {
    window.addEventListener('load', cb);
}
</script>

If i use something like this to lazy load some of my css files, is it possible to add 2 css files into it or can it only load 1?

<script>
var cb = function() {
            var l = document.createElement('link'); 
            l.rel = 'stylesheet';
            l.href = 'yourCSSfile.css';
            var h = document.getElementsByTagName('head')[0]; 
            h.parentNode.insertBefore(l, h);
         };

var raf = requestAnimationFrame || mozRequestAnimationFrame ||
          webkitRequestAnimationFrame || msRequestAnimationFrame;

if (raf) { 
   raf(cb) 
} else {
    window.addEventListener('load', cb);
}
</script>
Share Improve this question edited Aug 17, 2017 at 3:37 denov 12.7k2 gold badges30 silver badges45 bronze badges asked May 9, 2015 at 7:54 TechagesiteTechagesite 4751 gold badge5 silver badges19 bronze badges
Add a ment  | 

1 Answer 1

Reset to default 6
function loadCss(filename) {
    var l = document.createElement('link');
    l.rel = 'stylesheet';
    l.href = filename
    var h = document.getElementsByTagName('head')[0];
    h.parentNode.insertBefore(l, h);
}

function cb() {
    loadCss('yourCSSfile.css');
    loadCss('yourCSSfile2.css');
}

window.addEventListener('load', cb);

http://jsfiddle/vs9wLjvp/

发布评论

评论列表(0)

  1. 暂无评论