js异步预加载文件。

/**
 * js异步并发预加载文件
 * @param pageList
 * @param onComplete
 */
function preloadPages(pageList, onComplete) {
    // 确保页面完全加载并展示后执行预加载
    window.addEventListener('load', () => {
        // 使用 Promise.all 来并发加载页面
        const fetchPromises = pageList.map(url =>
            fetch(url, {method: 'GET', mode: 'no-cors'})
                .then(response => {
                    if (response.ok || response.status === 0) {
                        // console.log(`预加载 ${url} 成功`);
                    } else {
                        console.warn(`预加载 ${url} 失败: ${response.status}`);
                    }
                })
                .catch(error => {
                    console.error(`无法预加载 ${url}: `, error);
                })
        );

        // 等待所有请求完成
        Promise.all(fetchPromises)
            .then(() => {
                console.log('所有页面已预加载');
                if (typeof onComplete === 'function') {
                    onComplete();  // 调用回调函数
                }
            })
            .catch(error => {
                console.error('预加载过程中出现错误:', error);
            });
    });
}

使用示例：在页面完全加载后，预加载 a.html 和 b.html

preloadPages(['a.html', 'b.tef', 'c.mp3', 'd.png']);

• JS异步加载文件
• JavaScript图片预加载技术
• JavaScript 异步加载，提高网页的浏览速度
• 如何控制页面内容的加载顺序
• JQuery判断页面是否已经加载了JQuery文件
• JS动态加载以及确定加载完成
• JS 判断图片是否加载完毕
• 使用JavaScript动态加载JS文件