양동민초보의 프로그래머 캡숑고수 머작전~!

회원가입, 아이디칸, 비밀번호칸, 닉네임칸, 생년월일칸, 등록버튼 우선 row 클래스를 만든다. DOCTYPE html> 회원 가입 .outbox{ width:500px; } function checkId(){ var regex = /^[a-z][a-z0-9]{7,19}$/; var idInput = document.querySelector("input[name=id]"); var idSpan = document.querySelector("input[name=id] + span"); if(regex.test(idInput.value)){//정상 idSpan.textContent = "올바른 아이디입니다"; } else{//이상 idSpan.textContent = "영문 소문자와 숫자를 섞어 8~20자 ..

정규표현식이란 "문자열 검사식"이다. 일일이 문자열을 검사하기에는 에너지 낭비가 너무 심하다. ex)8~20자 이내이며, 영문 소문자와 숫자로만 구성된 아이디를 검사한다면, https://regexper.com 사이트를 들어가보자. 예를 들어 휴대전화번호 모양을 예시로 들어보자. 첫번째 자리 0 두번째자리 1 세번째자리 0/1/6/7/8/9 중 하나 네번째자리 - 다섯번재자리 1~9중 하나 여섯번째자리 0~9중 하나 일곱번째자리 0~9중 하나 여덟번째자리 0~9중 하나 아홉번째자리 - 열번째자리 0~9중 하나 열한번째자리 0~9중 하나 열두번째자리 0~9중 하나 열세번째자리 0~9중 하나 끝 홈페이지를 보면 입력 칸이있다. ^는 시작 $는 끝 []는 one of라는 의미이다. 휴대폰 번호를 예로 들자면 ..

목표 : input 태그에 입력을 하면 입력된 글자수를 span에 표시하는 것. input 이란 어떤 입력이 발생한 것을 말한다. 입력 외에도 마우스로 눌렀다가 떼는 경우까지 모두 포함한다. 0 0 이 외에 onblur이벤트가있다. 회원가입의 경우에 필요한 이벤트인데, oninput : 입력 발생시 onchange : 입력값의 변화 발생시 onblur : 입력창(칸)에서 다른 입력창(칸)으로 이동 시(focus-out)

확대버튼 | 축소버튼 ->확대버튼을 누르면 이미지가 조금씩(30px씩) 확대 ---------------------- ->축소버튼을 누르면 이미지가 조금씩(30px씩) 축소 이미지(최초크기 200x200) ->단, 최소크기는 90x90 최대크기는 450px을 넘을 수 없습니다. 이러한 문제가 있다고하면, 스타일시트를 사용하기위해 우선 를 넣어주고 -->px안써도적용됌 위와 같은 식인데, 여기서 typeof라는 명령으로 데이터의 유형을 파악할 수 있다. console.log(typeof img.width); -> img.width 값은 number 형태로 자바스크립트에서 관리된다. 자바스크립트에서는 number, boolean, string, object, function 등으로 데이터 유형을 구분한다. ..

기본적으로 안에 비밀번호 확인 및 검사 칸을 만들어보면, 비밀번호 : 비밀번호 확인 : 검사 결과 : 이렇게 기본 골격을 만들어 주고 그 위 태그안에 기능을 넣어준다. 함수 이름은 가급적 너무 흔한 단어는 제외하고 구현해준다. 내장된 함수 이름과 겹칠 수 있기 때문이다. 현재 비밀번호/비밀번호 확인/검사 결과 총 3개를 제어해야하는 함수를 만들어야 한다. var를 통해 만들어준다. 여기서 #으로 쓰는 이유는 id라서 그렇다. 클래스였다면 . 을 썼을 것이다. 또한 팁으로 [F12키]내 콘솔에 passwordCheck(); 하고 엔터를 누르면 함수가 잘 지정되어있는지 확인할 수있다. 이정도면 마무리 되었다 생각할 수 있지만, pw와 pw2값이 존재하지 않아도 통과가 되는 상황이 있을 수 있다. 때문에, 미..

DOCTYPE html> 값 복사 프로그램 //복사 함수 //2개의 태그를 각각 불러온다 function copy(){ var a = document.querySelector(".a"); var b = document.querySelector(".b"); b.value = a.value; }