JavaScript/JavaScript
-
JavaScript 이벤트(Event) 개요 및 간단한 활용, 게시글 보호팁JavaScript/JavaScript 2019. 12. 25. 01:40
191224 수업 내용 정리 이벤트(Event) 운영체제가 인식가능한 사용자들의 모든 행동 (키보드, 마우스) + 스크린터치 이벤트 발생 대상자 종류 이벤트핸들러(EventHandler) on + 이벤트종류명 = "함수" click 마우스 클릭 onclick="" load 문서(html)를 읽어들일때 onload="" unload 현재 사이트 → 다른 사이트 이동 onunload="" (IE O, chrome X) change 콤보박스에서 특정한 항목을 선택하면 발생되는 이벤트 onchange="" mouseover 마우스를 대상 위에 올리면 발생 onmouseover="" mouseout 특정위치에서 마우스포인터가 벗어날때 onmouseout="" Blur input type="text"에서 커서가 밖..
-
JavaScript 배열(Array) 개요 및 작성법, Method 몇 가지JavaScript/JavaScript 2019. 12. 25. 01:22
191224 수업 내용 정리 배열(array) 같은 자료형의 변수들을 모아둔 집합체 (문자열은 문자열끼리, 숫자형은 숫자형끼리 묶어야함) ※ 자바스크립트는 서로 다른 자료형의 값을 묶어줄 수 있음 ※ 배열의 요소는 서로 연속적임 순서는 0번부터 시작 많은 양의 값(데이터)을 다룰 때 유용 비슷한 변수를 여러가지 선언하는 것 보다 효율적 여러 변수 선언시 : 여러 변수를 메모리에 무작위로 저장 → 불러오는 속도가 느려짐 배열 사용시 : 변수의 갯수가 1개로 통합 → 메모리에 연속적으로 저장 → 속도 향상 형식 배열이름(변수의 대표이름) = new Array(요소1, 요소2,,,); var 배열이름 = [요소1, 요소2,,,]; 예제 a = new Array("배열", "인덱스", "길이", "추가"); v..
-
JavaScript 중첩 if문JavaScript/JavaScript 2019. 12. 25. 01:17
191224 수업 내용 정리 중첩 if문 if문 내부에 또 다른 if문이 들어간 제어문 형식 if(조건식1){ if(조건식2){ 자바스크립트 코드; } } 예제 JavaScript function test() { var sel = ""; //선택한 그림을 알려주는 문자열 변수 if( (document.myform.a1.checked==false)&& (document.myform.a2.checked==false)&& (document.myform.a3.checked==false) ){//체크가 안 된 경우 alert("최소 한 가지의 그림은 선택해 주세요"); } else { //최소 한 개라도 체크된 경우 if(document.myform.a1.checked) { //그 자체로 true/false 값을..
-
JavaScript 선택문(Switch~case문)JavaScript/JavaScript 2019. 12. 23. 23:24
191223 수업 내용 정리 선택문 switch~case 문 몇 가지 값이 정해져 있는 경우에 함수를 제어하기 용이함, else if문보다 속도가 빠름 형식 switch(변수){ case 값1: 코드1; //값1에 해당하는 변수가 들어오면 코드1을 실행 break; // ※탈출문, 케이스1의 경우에 함수에서 빠져나감(종료) case 값2: 코드2; break; case 값3: 코드3; break; default: 코드4; //설정한 값 중에 일치하는 값이 없다면 default에 해당하는 코드4가 실행됨 } 예제 : div 박스 색깔 변경 버튼 만들기 //JavaScript function setColor(n) { var box = document.getElementById("box"); /* getEle..
-
JavaScript Else If 문JavaScript/JavaScript 2019. 12. 23. 23:14
191223 수업 내용 정리 else if 문 조건식에 따라서 처리할 문장이 하나 이상인 경우에 사용, 실행속도가 느려짐 형식 if(조건식1){ 자바스크립트 코드; // 조건식1이 참인 경우 실행 } else if(조건식2){ 자바스크립트 코드2; // 조건식1이 거짓이고, 조건식2는 참인 경우 실행 } else if(조건식3){ 자바스크립트 코드3; } else { 자바스크립트 코드4; // 모든 조건식이 거짓인 경우 실행 } 순서도 예제 : 입력 값에 따라 페이지에 출력되는 내용 제어하기 var qs = prompt("당신이 좋아하는 언어는? 1.자바 2.자바스크립트 3.C언어", ""); if((qs == "자바") || (qs=="1")) //조건식 : 변수, 수식, 연산자 document.wri..
-
JavaScript 제어문 개요 및 If 문JavaScript/JavaScript 2019. 12. 23. 22:54
191223 수업 내용 정리 제어문 제어문 : 특정한 조건에 따라서 실행될 수도 되지 않을 수도 있는 문장 ▶ 조건문, 선택문, 반복문 ↔ 순차문 : 코딩 순서대로 실행이 되는 구문 조건문 조건식의 값이 true인지 false인지에 따라 자바스크립트 코드를 제어함 if 문 조건식의 값이 true일 때 함수를 실행 형식 if(조건식){ //변수, 수식(계산식 -> 논리, 관계) 자바스크립트 코드; } // Block {} : 실행 범위 지정, 코드가 한 문장이라면 생략 가능, 1:1 대응 관계 예제 var num = 5; if(num < 10){ document.write("안녕"); } else 문 if문의 조건식이 false일때 함수를 실행 형식 if(조건식){ 수행1; // 조건식이 true일 때 }..
-
JavaScript 내장함수 삼총사(alert, prompt, confirm)JavaScript/JavaScript 2019. 12. 23. 22:38
191223 수업 내용 정리 내장함수(alert, prompt, confirm) 자바스크립트 내부에 기본적으로 존재하는 함수 alert() 경고성 문장을 출력할 때 사용하는 함수 alert("이름은 \n필수입력입니다."); //브라우저에 경고창 팝업, \n : 줄바꿈 prompt() 사용자로부터 값을 입력 받아 출력시킬 때 사용하는 내장함수 ※ prompt(" ", " ")처럼 두번째 매개변수로 기본값을 설정할 수 있음 prompt("당신의 이름을 입력하세요"); //브라우저에 값을 입력 할 수 있는 알림창 팝업 var name = promt(""); /* prompt()는 매개변수와 반환값이 있는 함수이기 때문에 반환값을 저장할 변수를 선언해야함 */ document.write("당신의 이름은 "+na..
-
JavaScript 함수 개요 및 작성법JavaScript/JavaScript 2019. 12. 23. 22:26
191223 수업 내용 정리 함수 어떤 기능을 가진 최소한의 작업 단위(특정 목적을 가짐, 계산, 저장, 조회, 출력 등) 함수 작성 양식 function funcName() {} 함수명은 카멜 케이스(camelCase)로 작성 카멜 케이스(Camel Case) : 첫글자는 소문자, 이어지는 부분은 대문자로 작성 ex) camelCase 함수의 종류 사용법에 따른 분류 내장함수 : 프로그래밍 언어에 이미 들어있는 함수 사용자정의 함수 : 사용자가 새롭게 만드는 함수 기능에 따른 분류 매개변수 X, 반환값X : 단순하고 반복적인 기능 수행, 일일이 보고할 필요 없음 function print() {document.write("단순-반복 기능 수행 ")} print(); //함수 호출 매개변수 O, 반환값X..