함수를 사용하는 방법에는 이벤트와 연결하는 방법과 함수를 호출하는 방법이 있다. 이벤트에 함수를 연결하는 경우 문서의 <head>와 <body>영역 모두 작성해도 상관이 없다. 하지만 <body>영역에 함수를 작성할 경우 함수가 적용될 태그 다음에 작성해야 함수를 호출해도 이상없이 작동된다.
<html>
<body>
<script type="text/javascript">
function changeText() {
document.getElementById("dp").innerHTML = "변경 후 텍스트";
}
changeText(); //바로 함수를 호출했을 경우
</script>
<div id="dp">변경 전 텍스트</div>
</body>
</html>
위 HTML의 실행 결과는 아래와 같다.
하지만 위 코드를 이벤트와 연결하여 함수를 호출하면 된다.
<html>
<body>
<script type="text/javascript">
function changeText() {
document.getElementById("dp").innerHTML = "변경 후 텍스트";
}
changeText();
</script>
<div id="dp">변경 전 텍스트</div>
<input type="button" onclick="changeText();" value="텍스트 변경" />
</body>
</html>
위 HTML의 실행 결과는 아래와 같다.
'Java Script & DOM > Java Script ' 카테고리의 다른 글
| 자바 스크립트의 배열 객체(Array) (0) | 2010.12.15 |
|---|---|
| 자바스크립트의 날짜 객체(Date) (0) | 2010.12.15 |
| 자바스크립트 - Math 객체 (0) | 2010.11.25 |
| 자바스크립트 - 문자열(String) 객체 (0) | 2010.11.25 |
| 자바스크립트 - tyr...catch 문, throws 문 (0) | 2010.11.25 |