JavaScript
-
자바스크립트_문제풀이JavaScript 2022. 4. 20. 00:28
사용자가 계산할 숫자 두 개를 입력하고 연산자도 선택하게 함 ‘=‘버튼을 누르면 오른쪽에 계산 결과가 나오며 계산 결과가 나오는 창은 읽기만 가능 이 때, 나누는 수가 0일 때 계산 결과 창의 배경이 빨갛게 변하며 ‘연산 불가‘라는 하얀 글자가 들어감 (위 조건은 / 연산과 % 연산 모두 같음) * 자바의 경우, 0으로 나누면 에러가 뜨며 종료되었지만 자바스크립트는 NaN 또는 ±Infinity를 결과 값으로 내며 모두 Number임 ±Infinity는 ==로 비교할 수 있고 NaN는 isNaN(변수 명) 으로 확인할 수 있음 모든 연산 경우에 대한 결과 값을 확인해 본 후 조건을 적용하는 것을 추천 Practice2 + - * / % =
-
JavaScript_정규표현식_주민등록번호_예제JavaScript 2022. 4. 15. 20:22
1. 사용자에게 입력받은 주민등록번호가 유효한지 확인 2. 생년, 생월, 생일, 성별 3. 000000-0000000 -생년 : 제한이 없고 숫자만 들어가면된다. ^\d{2} -생월 : 제한있다. 십/일 나눠서 생각해야 한다. (0[1-9]|1[0-2]) -생일 : 제한있다. 십/일 나눠서 생각해야 한다. (0[1-9]|1[0-2]) -성별 : 제한있으므로 나눠서 생각해야한다. [1-4] -전체 주민등록번호 : 제한이 없고 숫자만 들어가면 된다. \d{6}$ 실행확인
-
JavaScript_정규표현식JavaScript 2022. 4. 15. 20:16
: 회원가입의 설정 조건 표현에서 많이 사용된다 1) new 확인하기 스크립트에 대한 정규표현식을 만들겠다는 표현 객체로 2가지 방법 사용가능. 2) 스크립트 작성 확인하기 1) test() : 해당 글자가 존재하면 true, 존재하지 않으면 false 2) exec() : 해당 글자가 없으면 null, 있으면 배열(index, input 등) 반환 string의 메소드 1)match() == exec() ( )와 | 실행확인 공통되는 부분은--> ( | | )요일 밖으로 빼준다. 플래그 문자 g : 전역 비교 수행 i : 대소문자를 가리지 않고 비교 수행 /문자/ : 문자지정, 대소문자를 구별 실행확인 문자지정 --> /문자/ 이렇게 작성하고 추가해줄 문자를 /문자/g 또는 /문자/i 또는 /문자/gi..
-
JavaScript_EventJavaScript 2022. 4. 14. 21:25
이벤트 이벤트설정 방법 고전 이벤트 모델 : 여러 이벤트 동시에 연결할 수 있다. (클릭해서 실행하는 것과 마우스만 올려놓아도 실행되는 두가지를 동시가능) onclick : 클릭해서 실행. onmouseover : 마우스만 올려놔도 실행. test1실행확인 test2실행확인 test2_1실행확인 이벤트 발생 객체 인라인 모델 test4 실행확인 test4 실행확인 표준 이벤트 모델 addEventListener() removeEventListener() test5 실행확인 test6 실행확인 var test5 = document.getElementById('test5'); var test6 = document.getElementById('test6'); function fn_test5_1(){ conso..
-
JavaScript_DOMJavaScript 2022. 4. 14. 21:06
DOM(Document Object Model) 1) Node객체 -텍스트가 있는 노드 생성 -텍스트노드가 없는 노드 생성 2) innerHTML 3) 스타일 지정 4) 노드 삭제 1) Node객체 -텍스트가 있는 노드 생성 노드: 태그를 객체화 시켜서 보는 것(노드 = 태그) 글자를 넣을 수 있는 곳은 다 태그이다 실행확인 -텍스트노드가 없는 노드 생성 : 이미지넣기 실행확인 추가해서 사용할 수 있다. 2) innerHTML : 태그들을 다 넣을 수 있다. 실행확인 글 번호 글 제목 작성자 조회수 작성일자 innerText는 텍스트로 다 들어간다(내용을 글자로 집어넣어야할때 사용) 3) 스타일 지정 실행확인 2초에 걸려서 블랙으로 컬러가 변경되고 테두리가 라운드로 변화가 일어난다. 4) 노드 삭제 re..
-
JavaScript_BOMJavaScript 2022. 4. 14. 20:50
BOM(Browser Object Model) 1) navigator객체 : 웹페이지를 실행하고 있는 브라우저에 대한 정보를 갖고 있는 객체 2) screen객체 : 웹브라우저 화면이 아닌 운영체제 화면(모니터)의 정보를 가지는 객체 실행확인 화면크기가 다 다르기때문에 사이즈부분 확인 3) location객체 : 브라우저 주소 표시줄과 관련된 객체 실행확인 location.href : 페이지 이동 페이지 이동 네이버로 이동 네이버로 이동 .href를 넣지않아도 가능하다. reload() : 페이지를 새로고침하는 메소드 새로고침 새로고침 새로고침 reload()는 위지 유지한 상태에서 새로고침된다. assign()과 replace : 두 메소드 모두 location의 href를 재지정하는 메소드(페이지 이..
-
JavaScript_windowJavaScript 2022. 4. 14. 20:05
window객체 : 자바스크립트의 최상위 객체, BOM/DOM으로 나뉜다. : BOM(Browser Object Model) : location, navigator, history, screen객체 : DOM(Document Object Model) : document객체 window객체 : 브라우저 창에 대한 설정을 하는 객체 window객체의 timer메소드 1) setTimeout() : 타이머 맞추기할 때 사용 실행확인 3초 후에 이 페이지는 종료. 2) setInterval() :시계 만들기 실행확인 3) clearInterval() 카운트세기 (321종료!) 실행확인 +=을 사용하여 진짜 종료가 된건지 종료가 되지않으면 -1,-2...계속 카운팅된다. (확인해봐야한다.)