자바스크립트 사용법


HTML의 스크립트는 <script> 태그 사이에 배치되어야 합니다.

스크립트는 HTML 페이지의 <body> 섹션에 배치할 수 있습니다.

<script> 태그

HTML 페이지에 JavaScript를 삽입하려면 <script> 태그를 사용하세요.

<script> 및 </script>는 JavaScript의 시작 위치와 끝 위치를 알려줍니다.

<script>와 </script> 사이에 JavaScript가 포함되어 있습니다.

<script>
alert("My First JavaScript");
</script>

위 코드를 이해할 필요는 없습니다. 브라우저는 <script> 사이의 JavaScript 코드

lamp那些老旧的实例可能会在  <script> 标签中使用 type="text/javascript"。现在已经不必这样做了。JavaScript 是所有现代浏览器以及 HTML5 中的默认脚本语言。
를 해석하고 실행한다는 점만 이해하세요.


<body>

의 JavaScript 이 예에서 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 문은 페이지가 로드될 때 실행됩니다.

사용자가 버튼을 클릭하는 등 이벤트가 발생할 때 코드를 실행해야 하는 경우가 많습니다.

함수에 자바스크립트 코드를 넣으면 이벤트 발생 시 함수를 호출할 수 있습니다.

나중 장에서 JavaScript 함수 및 이벤트에 대해 자세히 알아보게 됩니다.

<head> 또는 <body>의 JavaScript

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>

버튼을 클릭하면 이 함수가 호출됩니다.

Instance

<!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 파일을 설정하세요.

예

<!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="我的第一个 JavaScript 函数";
}
lamp外部脚本不能包含  <script> 标签。