onmouseover: 마우스를 올렸을 경우, onomouseover 이벤트를 발생시킨다. onmouseleave: 올렸던 마우스가 나갔을 경우, onomouseleave 이벤트를 발생시킨다. (onmouseleave의 경우 onomouseover과 매우 비슷한데자식요소들까지 영향을 주느냐 안주느냐의 차이점이라고 한다.) onmouseover, onmouseleave 을 확인해보면 각각 이벤트를 'onmouseover!', 'onmouseleave!' 로 작성하여 콘솔창에 띄우게 해보았다. 마우스를 갖다대고 땔때마다 콘솔창에 텍스트가 뜨는 것을 확인할 수 있다. 이를 활용하여 색상이 변경되는 메뉴를 만들어보겠다. 미션: 마우스를 갖다대면 흰색으로 바뀌는 메뉴 상자를 만들어보자!! 1. html 구성: 상..

onclick : 마우스를 클릭할 때 브라우저에게 해야할 일을 알리는 바인딩 이벤트. name.onclick = 'javascriptCode'; 미션 : prompt에 받은 문자열을 화면에 크게 띄운 다음, 하단에 있는 빨강, 파랑, 초록 버튼을 누를 때마다 버튼명대로 문자색상을 변경할 것. 1. prompt에 문자열을 받는다. var num = String(prompt('텍스트를 입력해 주세요', '')); 2. 문자형태만 받기 위해 isNaN(Not a Number)이란 함수를 사용한다. 매게변수가 숫자인지 검사하는 함수로 isNaN(value) 형태로 쓴다. 숫자면 false, 숫자가 아니면 true를 반환한다. if (isNaN(num) == true && isNaN(num) != null) { ..

미션: prompt로 받은 문자열을 alert 함수로 출력. 변수선언 let :블록 스코프의 범위를 가지는 지역 변수를 선언하며, 선언과 동시에 임의의 값으로 초기화할 수 있다. prompt: 선택적 메세지를 갖고 있는 대화 상자를 띄움. 형식은 다음과 같다. result = window.prompt(message, default); 매게변수 message (생략가능): 사용자에게 보여줄 문자열. default(생략가능):입력 필드에 기본으로 채워 넣을 문자열. let name = prompt('이름을 입력해주세요'); 만약 이름이 입력이 안되면 다시 프롬포트 띄우기를 해준다. if(name ==='' ){ name =prompt('입력해주세욥!!!!'); } 웹페이지 alert기능을 통해 출력한다. -..

HTML은 웹 콘텐츠의 구조를 짜고 의미를 부여하는 마크업 언어로, 어디가 문단이고 헤딩이고, 데이터 형태, 구성을 정의해준다. 웹페이지 만드는데 사용하는 가장 기본적인 언어다. 자바스크립트 사용하기 앞서 DOM 개념을 잠깐 훑고 가보겠다. DOM을 이해하면 웹개발을 하는데 좀더 큰 그림을 볼 수 있기 때문이다. DOM 은 Document Object Model의 약자로, 한글로는 문서 객체 모델이다. W3C의 표준이기 때문에 의 표준화한 API들의 기반이 된다. (W3C: 웹 표준과 가이드라인 개발 수행 조직) DOM은 원본 HTML 문서의 객체 기반 표현 방식이며 DOM의 개체 구조는 “노드 트리”로 표현된다. HTML과 DOM은 서로 비슷하지만, 가장 큰 차이는 단순 텍스트로 구성된 HTML 문서의..