JavaScript 사용법
HTML의 스크립트는 <script> 태그와 </script>
스크립트는 HTML 페이지의 <body> 섹션에 배치할 수 있습니다.
<script> 태그
JavaScript를 HTML 페이지에 삽입하려면 <script> 태그를 사용하세요.
<script> 및 </script>는 JavaScript의 시작 위치와 끝 위치를 알려줍니다.
<script>와 </script> 사이의 코드 줄에는 JavaScript가 포함되어 있습니다.
<script>
alert("My first JavaScript");
</script>
위의 코드를 이해해야 합니다. 브라우저는 <script>와 </script> 사이의 JavaScript 코드를 해석하고 실행한다는 점만 이해하세요.
<body>
이 경우 JavaScript는 페이지가 로드될 때 HTML의 <body>에 텍스트를 씁니다.
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>PHP中文网(php.cn)</title> </head> <body> <p> JavaScript 能够直接写入 HTML 输出流中: </p> <script> document.write("<h1>这是一个标题</h1>"); document.write("<p>这是一个段落。</p>"); </script> <p> 您只能在 HTML 输出流中使用 <strong>document.write</strong>。 如果您在文档已加载后使用它(比如在函数中),会覆盖整个文档。 </p> </body> </html>
프로그램을 실행해 보세요
JavaScript 함수 및 이벤트
위 예제의 JavaScript 문은 페이지가 로드될 때 실행됩니다.
일반적으로 사용자가 버튼을 클릭하는 등 이벤트가 발생할 때 코드를 실행해야 합니다.
함수에 자바스크립트 코드를 넣으면 이벤트 발생시 함수를 호출할 수 있습니다.
<head> 또는 <body>
HTML 문서에 스크립트를 무제한으로 넣을 수 있습니다.
스크립트는 HTML의 <body> 섹션이나 <head> 섹션에 있을 수 있습니다.
일반적인 접근 방식은 기능을 <head> 섹션이나 페이지 하단에 배치하는 것입니다. 이를 통해 페이지 내용을 방해하지 않고 동일한 위치에 배치할 수 있습니다.
<head>
의 JavaScript 함수 이 예에서는 HTML 페이지의 <head> 섹션에 JavaScript 함수를 배치합니다.
버튼을 클릭하면 이 함수가 호출됩니다.
Instance
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>PHP中文网(php.cn)</title> <script> function myFunction(){ document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数"; } </script> </head> <body> <h1>我的 Web 页面</h1> <p id="demo">一个段落。</p> <button type="button" onclick="myFunction()">点击这里</button> </body> </html>
프로그램을 실행하여 사용해 보세요.
<body> JavaScript 함수
HTML 페이지의 <body> 섹션에 JavaScript 함수를 배치합니다.
버튼을 클릭하면 이 함수가 호출됩니다.
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>PHP中文网(php.cn)</title> </head> <body> <h1>我的第一个 Web 页面</h1> <p id="demo">一个段落。</p> <button type="button" onclick="myFunction()">点击这里</button> <script> function myFunction(){ document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数"; } </script> </body> </html>
프로그램을 실행하여 사용해 보세요
외부 JavaScript
스크립트를 외부 파일에 저장할 수도 있습니다. 외부 파일에는 여러 웹 페이지에서 사용되는 코드가 포함되는 경우가 많습니다.
외부 JavaScript 파일의 파일 확장자는 .js입니다.
외부 파일을 사용해야 하는 경우 <script> 태그의 "src" 속성에 .js 파일을 설정하세요.
Example
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>PHP中文网(php.cn)</title> </head> <body> <h1>我的 Web 页面</h1> <p id="demo">一个段落。</p> <button type="button" onclick="myFunction()">点击这里</button> <p><b>注释:</b>myFunction 保存在名为 "myScript.js" 的外部文件中。</p> <script src="myScript.js"></script> </body> </html>
스크립트를 < head> 또는 <body의 실제 작업 효과>는 <script>
myScript.js 파일 코드는 다음과 같습니다.
function myFunction(){
document.getElementById("demo").innerHTML="My first JavaScript function";}
참고 : 외부 스크립트에는 <script> 태그가 포함될 수 없습니다.