[HTML, JavaScript] 정규표현식
·
개발/html, css, js
정규표현식 정규표현식은 문자검색과 교체에 사용되는 패턴을 제공한다. 자바스크립트에서 RegExp 객체의 문자 함수를 조합해 정규표현식을 사용할 수 있다. let reg = new RegExp('안녕','i'); console.log(reg) 출력 값 : /안녕/i RegExp는 두개의 매개변수가 들어간다. => RegExp( 찾는 문자, 플래그) "/"는 자바스크립트에서 정규표현식을 생성하고 있다는 것을 알려준다. 문자열에서 따옴표를 쓰는것과 같다. 정규표현식을 사용하는 이유 : 이메일 형식인지 체크할 때, 아이디 조건 설정할 때 1. 플래그의 종류 [1] i : 대소문자 구분없이 구별할 수 있다. [2] g : 패턴과 일치하는 모든 것을 찾는다. g가 없으면 일치하는 것에서 첫번째 것만 가져온다. [3..
[JS, HTML, CSS] 이벤트
·
개발/html, css, js
시작 // 이벤트 함수의 타겟 // 클릭이벤트 window.onclick = function(event){ //event.target은 이벤트가 발생한 요소 //event 태그의 이벤트가 담겨있다. console.log(event.target); event.target; //클래스가 무엇인지로 판단을 해서 이벤트를 적용시킬수도 있다. if(event.target.classList.contains("_target")){ console.log("있어") } //클래스가 무엇인지 가져와서 조건문으로 이벤트를 설정해 줄수 있다. let _class = event.target.className; switch(_class){ case "_target": break; case : break; default: brea..
[HTML, CSS] 이벤트리스너
·
개발/html, css, js
//이벤트 리스너 //이벤트 리스너 제거 let el = document.createElement("div"); //el에 test클래스 추가 //클래스 여러개 추가 el.className = "test test2 test3"; //el에 id 추가 el.id = "test"; //익명함수를 변수에 담아 놓았다 let onevent = function(){ console.log("난 이벤트") el.removeEventListener("click",onevent); } //el에 이벤트를 추가하는데 이벤트 타입은 click이고 두번째 매개변수 함수는 //onevent 변수에 담긴 익명함수다. el.addEventListener("click",onevent); //removeEventListener 이벤트..
[HTML, JavaScript] 가위바위보, 일정 캘린더 만들기
·
개발/html, css, js
1. 가위바위보 [1] HTML 주먹 가위 보 게임 시작하기 [2] css body{ height: 100vh; } .background { background-color: blanchedalmond; width: 100%; height: 50%; position: absolute; } #gameStart { text-align: center; width: 200px; height: 50px; position: relative; top: 25%; left: 50%; transform: translate(-50%,-50%); } #leftround button{ width: 100px; height: 50px; position: relative; top: 200px; left: 150px; } [3] Ja..
[JavaScript] 각종 이벤트
·
개발/html, css, js
1. UI 이벤트 console.log(document.querySelector(".tag")); //load - 페이지와 기타 요소들의 로딩이 완료됬을때 window.onload = function(){ //로드가 완료되고 console.log("페이지가 로드됨"); console.log(document.querySelector(".tag")); } // window.addEventListener("load", function(){ //여기도 로드가 완료되고 실행되는 함수 console.log("페이지가 로드됨2"); }) //어트리뷰트를 사용하거나 //window.addEventListener("이벤트의 타입, 함수")를 사용하여 // 이벤트 핸들러에도 load이벤트를 등록할수 있다. //resize..
[프로그래머스 level 1 JS] 실패율
·
개발/알고리즘
코딩테스트 연습 - 실패율 실패율 슈퍼 게임 개발자 오렐리는 큰 고민에 빠졌다. 그녀가 만든 프랜즈 오천성이 대성공을 거뒀지만, 요즘 신규 사용자의 수가 급감한 것이다. 원인은 신규 사용자와 기존 사용자 사이에 스 programmers.co.kr function solution(N, stages) { var answer = []; //실패율 //배열 요소 : 실패율 let failRate = []; let failIndex = []; // 각 stages 실패율 = stages 숫자 갯수 / stages 이상의 숫자 갯수 for(let i = 0; i