Javascript。如何停止执行脚本，直到所有脚本都加载完毕

在JavaScript中，如果你想在所有脚本都加载完毕后再继续执行后续代码，可以使用以下几种方法：

1. 使用 `window.onload` 事件

window.onload 事件会在页面上所有的资源（包括图片、脚本等）都加载完毕后触发。

window.onload = function() {
    // 所有资源加载完毕后的代码
};

2. 使用 `defer` 属性

在 <script> 标签中使用 defer 属性可以让浏览器延迟执行脚本，直到文档解析完毕。

<script src="script1.js" defer></script>
<script src="script2.js" defer></script>

3. 使用 `async` 和 `defer` 属性组合

如果你有多个脚本，并且希望它们并行加载但按顺序执行，可以结合使用 async 和 defer 属性。

<script src="script1.js" async></script>
<script src="script2.js" defer></script>

4. 使用动态创建的 `<script>` 标签

你可以动态创建 <script> 标签并监听其 load 事件，确保脚本加载完毕后再执行后续代码。

function loadScript(src, callback) {
    var script = document.createElement('script');
    script.src = src;
    script.onload = callback;
    document.head.appendChild(script);
}

loadScript('script1.js', function() {
    loadScript('script2.js', function() {
        // 所有脚本加载完毕后的代码
    });
});

5. 使用 Promise 和 `fetch`

如果你需要加载的是外部脚本文件，可以使用 Promise 和 fetch 来确保脚本加载完毕后再执行后续代码。

function loadScript(url) {
    return new Promise((resolve, reject) => {
        const script = document.createElement('script');
        script.src = url;
        script.onload = resolve;
        script.onerror = reject;
        document.head.appendChild(script);
    });
}

Promise.all([
    loadScript('script1.js'),
    loadScript('script2.js')
]).then(() => {
    // 所有脚本加载完毕后的代码
}).catch(error => {
    console.error('脚本加载失败:', error);
});