JavaScript 사용

<script> 태그

HTML에서 JavaScript 코드는 <script> 와 </script> 태그 사이.

예제

<script>
document.getElementById("demo").innerHTML = "내 첫 번째 JavaScript";
</script>

직접 시도해 보세요

주의사항:오래된 JavaScript 예제는 여전히 사용할 수 있습니다. type 속성: <script type="text/javascript">.

주의사항:type 속성은 필수가 아닙니다. JavaScript는 HTML의 기본 스크립트 언어입니다.

JavaScript 함수와 이벤트

JavaScript 함수함수는 호출될 때 실행될 수 있는 JavaScript 코드 블록입니다.

예를 들어,이벤트이벤트가 발생할 때 함수를 호출할 수 있습니다. 예를 들어, 사용자가 버튼을 클릭할 때.

안내:또한, 이제는 함수와 이벤트에 대해 더 많이 배울 것입니다.

<head> 또는 <body> 내의 JavaScript

HTML 문서에 script를 배치할 수 있습니다.

스크립트는 HTML 페이지의 <body> 또는 <head> 부분에 배치되거나 두 부분 모두에 배치될 수 있습니다.

<head> 내의 JavaScript

이 예제에서는 JavaScript 함수가 HTML 페이지의 <head> 부분.

이 함수는 버튼이 클릭될 때 호출됩니다:

예제

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction() {
    document.getElementById("demo").innerHTML = "문서가 변경되었습니다.";
}
</script>
</head>
<body>
<h1>한 웹 페이지</h1>
<p id="demo">하나의 문서</p>
<button type="button" onclick="myFunction()">시도해보세요</button>
</body>
</html>

직접 시도해 보세요

<body> 내의 JavaScript

이 예제에서는 JavaScript 함수가 HTML 페이지의 <body> 부분.

이 함수는 버튼이 클릭될 때 호출됩니다:

예제

<!DOCTYPE html>
<html>
<body> 
<h1>A Web Page</h1>
<p id="demo">하나의 문서</p>
<button type="button" onclick="myFunction()">시도해보세요</button>
<script>
function myFunction() {
   document.getElementById("demo").innerHTML = "문서가 변경되었습니다.";
}
</script>
</body>
</html>

직접 시도해 보세요

안내:스크립트를 배치하세요: <body> 요소의 끝에 배치하여 디스플레이 속도를 개선할 수 있습니다. 스크립트 컴파일이 디스플레이 속도를 늦추기 때문입니다.

외부 스크립트

스크립트는 외부 파일에 배치할 수 있습니다:

외부 파일: myScript.js

function myFunction() {
   document.getElementById("demo").innerHTML = "문서가 변경되었습니다.";
}

외부 스크립트는 여러 다른 웹 페이지에서 같은 스크립트를 사용할 때 매우 유용합니다.

JavaScript 파일의 확장자는 .js를 추가하세요.

외부 스크립트를 사용하려면, <script> 태그의 src (원본) 속성에서 스크립트 이름을 설정할 수 있습니다:

예제

<script src="myScript.js"></script>

직접 시도해 보세요

주소: <head> 또는 <body> 내부에 외부 스크립트 참조를 배치합니다.

이 스크립트의 표현은 그것이 배치된 <script> 태그 안에서는 동일합니다.

주의사항:외부 스크립트는 포함할 수 없습니다. <script> 标签。

外部 JavaScript 的优势

在外部文件中放置脚本有如下优势：

  • 分离了 HTML 和代码
  • 使 HTML 和 JavaScript 更易于阅读和维护
  • 缓存的 JavaScript 파일可以加速页面加载

한 페이지에 여러 스크립트 파일을 추가하려면 - 여러 script 태그를 사용하세요:

예제

<script src="myScript1.js"></script>
<script src="myScript2.js"></script>

외부 참조

완전한 URL 또는 현재 웹 페이지에 대한 상대 경로로 외부 스크립트를 참조할 수 있습니다:

이 예제는 스크립트에 대한 완전한 URL을 사용하여 링크합니다:

예제

<script src="https://www.codew3c.com/js/myScript1.js"></script>

직접 시도해 보세요

이 예제는 현재 사이트에 있는 지정된 폴더에 있는 스크립트를 사용합니다:

예제

<script src="/js/myScript1.js"></script>

직접 시도해 보세요

이 예제는 현재 페이지와 같은 폴더에 있는 스크립트를 링크합니다:

예제

<script src="myScript1.js"></script>

직접 시도해 보세요

당신은 HTML 파일 경로파일 경로에 대해 더 많이 배우세요.