HTML에서 자바스크립트 로드하기
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
1. Javascript Inline 방식 :
<input onclick="alert('hello world')" type="button" name="inline"><br/>
2. <h2 id="hw">script 태그 내에 삽입하는 방식 :</h2>
<script type="text/javascript">
var hw = document.getElementById("hw");
hw.addEventListener("click",function(){
alert("hello world");
})
</script>
<br/>
3. 외부 파일로 분리하는 방식 :
<script type="text/javascript" src="./script2.js"></script>
<br/>
4. 스크립트의 위치 :
스크립트는 어느 위치에나 올 수 있지만 body 태그의 마지막 부분에 위치시키는 것이 좋다.
why??
=> 제어할려는 태그가 다 로딩된 다음에 작업이 수행되어야 하니까(로딩되지 않은 상태에서 작업시 제어 불가)
=> 위치에 상관없이 태그가 다 로딩된 후 수행토록 하려면
: javascript의 경우
=> window.onload = function(){
이 내부 코드는 태그가 다 로딩된 이후 수행하게 된다.
}
jquery의 경우
=> document.ready(function(){
})
</body>
</html>