HTML에 외부 JS 파일을 포함하려면 <script> 태그를 사용하고 로드할 파일의 URL을 지정하세요. 유형, 지연 또는 비동기 속성을 지정하여 로드 및 실행이 발생하는 방식을 제어할 수도 있습니다. 일반적으로 <script> 태그는 페이지 렌더링을 차단하지 않도록 <body> 섹션의 하단에 배치되어야 합니다.
HTML에 외부 JS를 도입하는 방법
HTML에 외부 JS 파일을 도입하는 것은 JavaScript 코드를 별도의 파일로 구성하고 여러 페이지에 쉽게 분산시켜 재사용할 수 있게 해주는 일반적인 방법입니다. 외부 JS 파일을 가져오는 방법은 다음과 같습니다.
<script> 태그 사용 <script> 标签使用 <script> 标签来引入外部 JS 文件。该标签的 src 属性指定要加载的脚本文件的 URL：
<code class="html"><script src="path/to/script.js"></script></code>
type 属性（可选）为了明确地指定正在加载的文件类型，您可以使用 type 属性：
<code class="html"><script src="path/to/script.js" type="text/javascript"></script></code>
defer 或 async 属性（可选）defer 和 async 属性用于控制脚本加载和执行的方式：
defer：表明脚本可以在页面解析完成后加载，但会在 DOMContentLoaded 事件触发之前执行。async：表明脚本可以异步加载并执行，不受页面解析或 DOMContentLoaded 事件的影响。<code class="html"><script src="path/to/script.js" defer></script> <script src="path/to/script.js" async></script></code>
<script> 标签通常，<script> 标签应放置在 HTML 文档的 <body> 部分的底部，以避免阻塞页面渲染。这样做可以确保所有 HTML 元素都在加载脚本之前被解析。
要加载多个外部 JS 文件，只需在 <head> 或 <body> 部分中添加额外的 <script> 标签即可。
注意：
.js
<script> 태그를 사용하여 외부 가져오기 JS 파일 . 이 태그의 src 속성은 로드할 스크립트 파일의 URL을 지정합니다: type 속성 지정(선택 사항) 🎜🎜🎜로드되는 파일 유형을 명시적으로 지정하려면 type 속성을 사용할 수 있습니다: 🎜rrreeedefer지정 code> 또는 async 속성(선택 사항) 🎜🎜defer 및 async 속성은 스크립트가 로드되고 실행됨: 🎜defer: 페이지 구문 분석이 완료된 후 스크립트를 로드할 수 있지만 DOMContentLoaded 이벤트가 트리거되기 전에 실행될 것임을 나타냅니다. 🎜🎜async: 스크립트를 비동기적으로 로드하고 실행할 수 있으며 페이지 구문 분석이나 DOMContentLoaded 이벤트의 영향을 받지 않음을 나타냅니다. 🎜🎜rrreee<script> 태그 배치 🎜🎜<script> 태그는 페이지 렌더링을 차단하지 않으려면 HTML 문서의 <body> 섹션 하단에 배치하세요. 이렇게 하면 스크립트가 로드되기 전에 모든 HTML 요소가 구문 분석됩니다. 🎜<head>를 추가하거나 섹션에 추가 <script> 태그를 추가합니다. 🎜🎜🎜참고: 🎜🎜.js 확장자로 끝나야 합니다. 🎜🎜스크립트가 다른 스크립트에 의존하는 경우 올바른 순서로 로드했는지 확인하세요. 🎜🎜위 내용은 HTML에 외부 js를 도입하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
