★ Event 사건 객체(혹은 태그)에서 발생하는 사건 언제 발생할지 예측 불가능(시간) ★ Event Handling 이벤트 등록(구현) 사건 처리 언제 발생할지 예측 불가능한 사건에 대해 처리를 하고 싶다. > 언젠가 사건이 발생하면 처리하기 위한 코드를 미리 준비한다. > 사건과 연결 > 이벤트 처리, 이벤트 매핑, 이벤트 구현 등.. 1. 정적 : HTML 태그에 직접 적용 2. 동적 : JavaScript 코드를 사용 window.document.form1.btn2.onclick = m1; //함수 포인터 function m1() { //코드 작성 window.document.form1.txt1.value = '아무개'; } ■ HTML 코드 Event ■ 실행 ex) ex1) 오전인지 오후인지..
★ 조작 1. CSS 선택자 > 태그 검색 > 접근 > 서식 조작 2. JavaScript 검색도구 > 태그 검색 > 태그 조작 HTML 계층 구조 활용 + JavaScript 탐색 (1) BOM, Browser Object Model 초창기 모델 현재까지 계속 사용 선택적 모델 > 일부 태그만 관리 > 일부 태그만 조작 가능 > 빠진 태그는 조작 불가능 일부 태그 : 이미지, 폼 태그 이외에는 조작 불필요하다고 판단. 태그의 name을 사용해서 접근 id, class는 인식 불가능 (2) DOM, Document Object Model BOM > 개선한 모델 현재까지 계속 사용(주력) BOM 기반 + 기능 추가 모든 태그를 인식 > 모든 태그를 조작 name, id, class 모두 인식 가능 ★ BO..
★ 배열, Array 자바스크립트 배열 Array(외형) + ArrayList(길이 가변, 자료형 자유) // 자바 사용시 : int[] nums = new int[3]; // 자바 스크립트 사용시 var nums = new Array(); //데이터 삽입 nums[0] = 100; nums[1] = 200; nums[2] = 300; nums[5] = 500; //이렇게 건너 뛰어서 되지만, 되도록 사용 금지!! (클린코드 X) //데이터 출력 for (var i=0; i //int[] nums = new int[] {100, 200, 300}; //int[] nums = {100, 200, 300}; //자바 스크립트 사용시 -> var nums2 = new Array(100, 200, 300); v..
★ DATE 시간을 다루는 내장 객체 현재 시각 var now = new Date(); //new 생성자함수() console.log(now); console.log(now.toString); //javascript는 자동으로 toString을 해줌 요소 추출 console.log(now.getYear()); //123 console.log(now.getFullYear());//2023 console.log(now.getMonth());//3(0부터) console.log(now.getDate());//21 console.log(now.getDay());//5(일(0)~토(6)) console.log(now.getHours());//10 console.log(now.getMinutes());//20 co..
★ 문자열 함수 문자열 선언 var txt = "Hello~ Hong~"; 1. 문자열 길이 console.log(txt.length); //자바(field), 자바스크립트(property) 2. 검색 indexOf() : 필드의 위치를 찾아주세요 lastIndexOf() : 끝에서부터 위치를 찾아주세요 console.log(txt.indexOf('~')); //5 console.log(txt.indexOf('~', 6)); //11 console.log(txt.lastindexOf('~')); //11 3. 대소문자 변환 console.log(txt.toUpperCase()); console.log(txt.toLowerCase()); 4. 추출 console.log(txt.substring(2,8));..
★ 형변환, Casting 1. number parseInt(value) 정수형으로 형변환 하여주는 함수 parseInt는 소수점 이하를 절삭한다. var n1 = 3.14; console.log(parseInt(n1)); n1= 3.99; console.log(parseInt(n1)); var n2 = '300'; console.log(parseInt(n2)); // number console.log(n2); // String 2. number parseFloat(value) float 형식으로 형변환 하여주는 함수 var n3 = 100; console.log(parseFloat(n3)); var n4 = '3.14' console.log(parseFloat(n4)); 숫자+문자열 처음부터 숫자가 나..
★ 변수 영역 1. 전역 변수 > HTML 페이지 전역 > 선언문 실행(생성) ~ 페이지 종료(소멸) var num1 = 100; //전역 변수. 태그 내에서 직접 선언. 2. 지역 변수 > 블럭 영역 변수(X), 함수 영역 변수(O), 함수만 지역으로 인식하고, 제어문을 인식하지 못한다. function m1() { var num2 = 200; //지역 변수 console.log('m1', num2); //지역내 지역변수 접근 O console.log('m1',num1); //지역내 + 지역변수 접근 O if(true) { var num3 = 300; //지역변수. if console.log('if', num3); } console.log('m1',num3); //이건 가능 } m1(); // cons..
★ JavaScript Function 구조 function m1(num) { return 10; } ex) 자바스크립트는 초기화가 되지 않는 변수의 상태를 null이라고 하지 않고, undefined라고 한다. console.log(arguments); //예약어 > 내장 배열 : 모든 매개변수를 자동으로 담는 배열 function m1() { console.log('m1'); } m1(); function m2(name) { console.log('name', name); console.log(arguments); //예약어 > 내장 배열 console.log(arguments[0]); console.log(arguments[1]); } m2('홍길동'); m2('아무개'); m2(); m2('홍길동..
