Question

我已阅读问题，但我无法找到与我的问题相关的答案。我有以下代码：

<script>
        var pText = "";
        var firstText = document.getElementById("firstText");
        pText += 'appear first';
        firstText.innerHTML = pText;
</script>
<script>
        var qText = "";
        var secondText = document.getElementById("secondText");
        qText += 'appear next';
        secondText.innerHTML = qText;
</script>

<div class="card text-center">
  <div class="card-header">
    <h1>title</h1>
  </div>
  <div class="card-body">
    <span id="firstText"></span>
    <span id="secondText"></span>
  </div>
</div>

由于脚本的排序，我期待结果是：

appear first
appear next

但是排序是：

appear next
appear first

我调查了defer和sync，但我不太确定如何使用这些属性。任何帮助将不胜感激！

Answer 1

我不是100％确定与脚本标签一起使用时的async / defer是什么，所以如果那真的是你想做的话，我会把它留给其他人。

如果您正在寻找的是控制这些脚本的顺序（或者如果这些只是理论上的实际脚本），则可以将每个脚本块放在一个函数中，将事件监听器附加到{{ 3}}并让窗口加载后处理程序尽快运行它们。然后你可以在事件处理程序中调用appearFirst(); appearNext();，你就会知道它将如何运行。

Javascript-脚本执行顺序

1 个答案: