HTML에 외부 js를 도입하는 방법
- 下次还敢원래의
- 2024-04-11 06:18:32816검색
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 文件的 URL 正确且脚本文件可访问。
- 脚本文件应该以
.js -
<script>태그를 사용하여 외부 가져오기 JS 파일 . 이 태그의src속성은 로드할 스크립트 파일의 URL을 지정합니다: rrreee
- 🎜
type 속성 지정(선택 사항) 🎜🎜🎜로드되는 파일 유형을 명시적으로 지정하려면 type 속성을 사용할 수 있습니다: 🎜rrreee- 🎜🎜
defer지정 code> 또는 async 속성(선택 사항) 🎜🎜defer 및 async 속성은 스크립트가 로드되고 실행됨: 🎜- 🎜
defer: 페이지 구문 분석이 완료된 후 스크립트를 로드할 수 있지만 DOMContentLoaded 이벤트가 트리거되기 전에 실행될 것임을 나타냅니다. 🎜🎜async: 스크립트를 비동기적으로 로드하고 실행할 수 있으며 페이지 구문 분석이나 DOMContentLoaded 이벤트의 영향을 받지 않음을 나타냅니다. 🎜🎜rrreee- 🎜🎜
<script> 태그 배치 🎜🎜<script> 태그는 페이지 렌더링을 차단하지 않으려면 HTML 문서의 <body> 섹션 하단에 배치하세요. 이렇게 하면 스크립트가 로드되기 전에 모든 HTML 요소가 구문 분석됩니다. 🎜- 🎜🎜여러 스크립트 로드(선택 사항)🎜🎜
<head>를 추가하거나 섹션에 추가 <script> 태그를 추가합니다. 🎜🎜🎜참고: 🎜🎜- 🎜외부 JS 파일의 URL이 올바른지, 스크립트 파일에 액세스할 수 있는지 확인하세요. 🎜🎜스크립트 파일은
.js 확장자로 끝나야 합니다. 🎜🎜스크립트가 다른 스크립트에 의존하는 경우 올바른 순서로 로드했는지 확인하세요. 🎜🎜위 내용은 HTML에 외부 js를 도입하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
이전 기사：HTML에서 외부 CSS를 연결하는 방법다음 기사：HTML에서 외부 CSS를 연결하는 방법