[JavaScript] JavaScript 명령 소스 제공 / onclick 이벤트 / 함수 호출

모든 웹문서에 공통적으로 제공해야하는 JavaScript 명령을 소스로 제공해 줄 수 있다.

01_hello.js

alert("JavaScript Source File에 작성된 자바스크립트 명령");

script 태그를 이용해 JavaScript Source File을 불러와 HTML 문서에 포함시킬 수 있다. 
→사이트를 구성하는 모든 웹문서에 동일한 기능(함수)을 제공하기 위해 사용한다. 

<script type="text/javascript" src="/web/js/01_hello.js"></script>

---

button 태그의 type 속성값을 [button]으로 설정하면 버튼만 출력되어, 이벤트가 발생되지 않는다.

<button type="button">버튼을 눌러보세요.</button>

html 태그의 onXXX 속성은 이벤트 리스너 속성으로, 이벤트 처리 명령을 설정값으로 설정할 수 있다.
이때, 이벤트 처리 명령을 JavaScript를 통해 만든다.

<button type="button" onclick="alert('이벤트 처리 명령 실행')">버튼을 눌러보세요.</button>

onclik: 버튼을 클릭했을 때 해당 명령을 실행한다. 

---

태그의 이벤트 리스너 속성값으로 자바스크립트 함수(이벤트 처리 함수)를 호출하여 사용할 수 있다. 
→ 다수의 명령을 실행해 원하는 기능이 실행될 수 있도록 만들어 준다.

01_hello.js

function eventHandle() {
	alert("이벤트 처리 함수의 명령실행");
}

 

01.hello.html

<button type="button" onclick="eventHandle();">버튼을 눌러보세요.</button>

---