마우스 사용할때 발생하는 이벤트 - onmouseXXX 로 시작 1. onmouseover : 해당 객체의 영역위에 커서가 진입하는 순간 발생 2. onmouseout : 해당 영역에서 커서가 빠져나가는 순간 발생 3. onmousedown : 해당 객체의 영역에서 마우스 버튼이 눌려지는 순간 발생 4. onmouseup : 해당 객체의 영역에서 마우스 버튼이 떼는 순간 발생 5. onmousemove : 해당 객체의 영여겡서 커서가 움직이는 순간 발생 어느 버튼을 사용했는지?event 객체- 이벤트에 의해서 호출되는 함수에서 사용하는 예약어- 발생한 사건의 여러가지 정보를 제공 객체- 마우스 왼쪽 버튼에 반응if(event.buttons == 1){txt1.value="마우스 다운";} var txt1..
Event, 이벤트 - BOM에서 다루는 이벤트- 사건- 사용자(사람)와 상호작용하면서 일어나는 사건 > 마우스(키보드,터치,음성..)를 조작하면 조작에 대한 반응ex) 마우스 버튼 클릭 > 프로그램상에서 이벤트 발생(클릭) > 미리 준비해놓은 프로그래밍 코드 호출(실행)이벤트 처리 방식1. 정적 방식- 태그의 속성으로 onXXX 속성을 사용하는 방식- onXXX : 이벤트 핸들러(Event Handler)2. 동적 방식 : DOM이나 JQuery 사용시 이벤트를 script에서 할당 가능. body onload 이벤트- 브라우저가 태그의 모든 내용을 읽은 직후 발생하는 이벤트- 브라우저가 모든 태그를 인식 가능한 상태 > 모든 태그에 접근 가능한 시점- 사용자는 화면을 보기 직전 상태- 페이지의 모든 ..
BOM(Broser Object Model) 자바스크립트 기능- 코어(Core) + 브라우저(BOM,DOM) + 확장 라이브러리BOM, Broser Object Model- 자바스크립트로 HTML 문서상의 객체를 접근 + 조작하기 위한 객체 모델(체계)- 모든 브라우저 지원함- 문서상의 일부 객체(태그)를 이미 정해진 트리구조를 통해서 접근 + 제어 모델(*****)- 객체(태그)를 식별하기 위한 식별자를 [name] 속성을 사용한다.(id,class 인식 못함)- 객체(태그) 중 유일한 객체는 예약어를 제공한다.(window, document 등..)- BOM 트리에 포함되어 있지 않은 태그들은 접근 불가.(조작불가능)DOM, Document Object Model- XML 인터페이스의 한 종류- XM..
배열(Array)- 자바에서는 순수배열과 컬렉션의 개념이 따로 있음.- 자바스크립트는 두개의 개념이 같이 존재.- Array + Collection : 길이 가변자바에서의 배열 선언 : int[] nums = new int[3]; 자바스크립트의 배열선언var nums = new Array(); 값 대입nums[0] = 100;nums[1]=200;nums[2]=300; 3,4 건너 뛰고 바로 5에 대입 -> 길이가 3개로 줬는데 어떻게 가능? -> List의 개념과 비슷(길이 가변)nums[5]=500;console.log(nums.length); 6 -> 배열의 length는 항상 마지막 인덱스에 1을 더한 값으로 표현됨.for(var i =0; i 셋 -> 그냥 nums[0]으로 해석된다. -> 문자..
날짜 시간 자료형 - 객체(object 형)- Date 클래스 제공현재시간 var now = new Date(); - 자바의 Calendar.getInstance();와 같음. - Date 객체가 생성되는 날짜정보를 가지게 됨.console.log(now); Sat Apr 06 2019 13:53:05 GMT+0900 (한국 표준시) //c.get(Calendar.YEAR)console.log(now.getYear()); 119 2자리 년도(2000년도 이전, 2000년도 119 이런식으로 년도 2000년 이전을 0으로 보고 이후를 1부터 시작.)console.log(now.getFullYear()); 2019 4자리 년도console.log(now.getMonth()); 3 월(0~11) : 그래서 월..
자바스크립트 문자열 함수들 - 자바스크립트에서 사용하는 문자열 함수.- 자바의 문자열 메소드와 비슷하다. var txt = "안녕하세요. 홍길동님. 안녕히가세요. 홍길동님"; 이런 문자열 변수가 있을때 1. 길이- txt.length 25반환 2. 검색- indexOf() - 왼쪽에서 오른쪽으로 검색.- lastIndexOf() - 오른쪽에서 왼쪽방향으로 검색- zero based index system- 없으면 -1 반환. console.log(txt.indexOf("요")); 4 console.log(txt.indexOf("홍길동",10)); 21 console.log(txt.lastIndexOf("요")); 18 console.log(txt.indexOf("아무개")); -1 3. 대소문자 변환- ..
형변환, Type Casting - 대부분 상황에서는 자바스크립트가 자동으로 형변환을 한다.(암시적 형변환)ex) "10"*2형변환 함수1. int parseInt()2. float parseFloat() 코드로 보는 자바스크립트 형변환 함수 예제 console.log("10"*2 ,typeof ("10"*2)); 20, number var n1=3.14;console.log(parseInt(n1)); 3 var n2 = 3.99;console.log(parseInt(n2)); 3 var n3="10";console.log(parseInt(n3),typeof parseInt(n3)); 10, numberconsole.log(n3,typeof n3); 10, stringvar n4 = "3.14"; con..
TabIndex, 탭 순서 설정 로그인 포맷이 있다고 할때! 로그인 아이디Login암호 다음과 같은 로그인폼이 있을 때, - tabindex =1 로 설정한 input 태그에 먼저 커서가 깜박이게 된다.- 그후 tabindex가 2인 암호가 깜빡이게 된다.- 이렇게 차례차례 숫자를 설정하여 Tab 순서를 정하면 된다~!
