javascript通过脚本标签定义范围？

Question

从来没有遇到过这个问题,也不知道为什么.唯一的解释是范围问题.

在同一页面中,我有两节JS:

...
 <script type="text/javascript">
    go();
  </script>

  <script type="text/javascript">
    function go()
    { alert('');  }
  </script>
...

这将显示错误:未定义go

哪里

...
     <script type="text/javascript">
        go();

        function go()
        { alert('');  }
      </script>
    ...

正在工作(显然).

<script>标签是否创建了JS的范围？救命 ？

Answer 1

这不是范围问题.如果在一个脚本元素中定义一个函数(在全局范围内),则可以在另一个脚本元素中使用它.

但是,脚本元素在遇到时会被解析和执行.

提升不适用于脚本元素.在较早的脚本元素的初始运行期间,在稍后的脚本元素中定义的函数将不可用.

您需要交换脚本元素的顺序,或延迟函数调用,直到定义它的脚本运行(例如,通过将其附加到onload事件处理程序).

<script>
    function go() {
        alert('');  
    }
</script>
<script>
    go();
</script>

要么

<script>
    window.addEventListener("load", function () { 
        go();
    }, false);
</script>
<script>
    function go() {
        alert('');  
    }
</script>

Answer 2

在转移到下一个元素之前,html解析器会停止执行您的脚本.因此,在执行第一个脚本元素之前,不执行下一个脚本元素.

这与以下内容相当:

<script>
document.getElementById("hello") //null because the html parser hasn't met the div yet.
</script>
<div id="hello"></div>