서버를 돌릴 필요없이 바로 확인할 수 있다.
노트패드를 다운받는다.
그리고 text문서를 .html을 붙여서 html 파일을 만든다.
이 파일 오른쪽을 눌러 notepad로 수정을 누른다.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 | <html> <head> <script type="text/javascript"> function hello(message){ alert(message+" 반갑습니다."); } window.onload = function() { alert("잘됩니다~"); //var p1 = $("#p1"); var p1 = document.getElementById("p1"); //p1.click()function({...}); p1.onclick = function() { alert("반갑습니다~"); }; p1.onmouseover = function(e) { alert(e.pageX + " " + e.pageY); alert("마우스 안녕?"); }; p1.onmouseout = function() { alert("마우스 잘가~"); }; p1.onmousewheel = function(e) { console.log(e); } }; </script> </head> <body> <input type="button" id="clickButton" value="눌러보세요~" onclick="alert('안녕');" /> <input type="button" id="clickButton2" value="더블클릭 해보세요~" ondblclick="alert('안녕');" /> <br/><br/> <div id="div1" style="width:150px; height:150px; background-color:#000;" onclick="for(var i=0; i<10; i++ ) {alert('안되는줄 알았지?');}"> </div> <br/> <div id="div2" style="width:150px; height:150px; background-color:#000;" ondblclick="alert('안되는줄 알았지?');"> </div> <br/><br/> <a href="javascript:void(0);" onclick="alert('^^');">클릭해보세요</a> <span id="span1" onclick="hello('안녕?');"> 클릭!! </span> <input type="text" id="text1" onfocus="alert('선택되었습니다.');"/> <input type="text" id="text2" onblur="alert('선택해제되었습니다.');" onfocus="alert('선택되었습니다.');"/> <p id="p1">onclick 속성을 사용하지 않았습니다~</p> </body> </html> | cs |
제이쿼리를 쓰면 무거워지므로
이런 방법으로 쿼리쓰지 않고 작동시킬수 있다.
또한 .hta 파일을 붙이면 어플리케이션으로 바로 볼수 있다.
심화공부를 하기위해 다음의 공부가 필요하다.
자바스크립트 클로져
자바스크립트 프로토타입
자바스크립트 오브젝트
'Back-end > Spring' 카테고리의 다른 글
[JPA] JPA에 관해.. (0) | 2016.05.04 |
---|---|
[HTML] 자동완성 기능 만들기 (0) | 2016.05.03 |
[HTML5] WebSocket을 이용한 채팅 만들기 (0) | 2016.04.22 |
[HTML5] 웹소켓( WebSockat ) (2) | 2016.04.22 |
[Spring] 게시판 만들기 (0) | 2016.04.21 |