前端动态加载静态资源

定义函数

function loadResources(type, src, callback) {
        let script = document.createElement(type);
        let loaded = false;
        if (typeof callback === 'function') {
            script.onload = script.onreadystatechange = () => {
                if (!loaded && (!script.readyState || /loaded|complete/.test(script.readyState))) {
                    script.onload = script.onreadystatechange = null;
                    loaded = true;
                    callback();
                }
            }
        }
        if (type === 'link') {
            script.href = src;
            script.rel = 'stylesheet';
        } else {
            script.src = src;
        }
        document.getElementsByTagName('head')[0].appendChild(script);
    }

调用方法

function addAudio(link) {
        let host = 'https://s0.pstatp.com/cdn/expire-1-M';
        let unloadedResourceCount = 2;
        //两个资源两次就是2
        let callback = (() => {
            return () => {
                if (!--unloadedResourceCount) {
                    colsole.log("加载完成")
                }
            };
        })(unloadedResourceCount, link);
        loadResources(
            'link',
            host + '/aplayer/1.10.1/APlayer.min.css',
            callback
        );
        loadResources(
            'script',
            host + '/aplayer/1.10.1/APlayer.min.js',
            callback
        );
        
    }