아시다시피 태그는 웹페이지에서 실행할 JavaScript를 지정하는 데 사용됩니다. <script> 태그는 JavaScript 코드를 직접 포함하거나 JavaScript 외부 URL을 가리킬 수 있습니다. </p> <h3 id="script-"><script> 태그는 나타나는 순서대로 실행됩니다. </h3> <p>다음 코드는 이를 직관적으로 보여줍니다. </p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:js;toolbar:false;"><script> var x = 3; alert(x); // Will alert '3'; 로그인 후 복사외부 링크 리소스를 사용할 때 로딩 순서는 그다지 직관적이지 않지만 여전히 그렇습니다. 로그인 후 복사 관련 학습 권장 사항: javascript 비디오 튜토리얼이 규칙은 외부 링크와 인라인 JavaScript를 혼합하는 경우에도 적용됩니다. 즉, 웹 사이트에 페이지 앞부분에 로드되는 느린 스크립트가 있으면 페이지 로드 속도가 상당히 느려집니다. 이는 또한 나중에 로드된 스크립트가 먼저 로드된 스크립트에 따라 달라질 수 있음을 의미합니다. 페이지 요소는 모든 스크립트가 로드되기 전까지 렌더링되지 않습니다. 즉, 이로 인해 발생하는 성능 문제에 신경 쓰지 않는 한 웹 페이지가 로드되기 전에 웹 페이지에서 모든 종류의 미친 작업을 수행할 수 있습니다. 그러나 웹페이지가 로드된 후 document.appendChild와 같은 메서드를 통해 DOM에 태그를 추가하는 경우에는 이 규칙이 적용되지 않습니다. 이러한 태그는 브라우저 요청 처리가 완료된 순서대로 스크립트를 실행하며, 로드 순서는 더 이상 보장되지 않습니다. <code>document.appendChild</code> 之类的方法添加 <script>标记到 DOM 中。这些标记会根据浏览器请求处理完成的先后执行脚本,不再保证加载顺序。</p><h3 id="-script-html-">当一个 <script>标记被执行,在它之前的 HTML 元素可以访问(但是在它之后的还不能用)</h3><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:js;toolbar:false;"><html> <head> <script> // document.head is available // document.body is not! // document.head is available // document.body is available