get / post

클라이언트가 서버로 요청을 보내는 방법인 HTML Method에는 크게 GET 방식과 POST방식 2가지가 있다. 아이디 *8자 이내로 만들어주세요 get vs post 처리방식 get post URL에 데이터 노출여부 O X URL 예시 insert.php?name=제목&contents=내용 insert.php 데이터의 위치 Header (헤더) Body (바디) 캐싱 가능 여부 O X get방식 어떠한 정보를 가져와서 조회하기 위해 사용되는 방식. GET 방식은 간단한 데이터를 URL에 넣도록 설계된 방식으로 데이터를 보내는 양에 한계가 있다. HTTP 자체는 GET 방식의 URL 길이에 제약을 두고 있지 않지만, 브라우저에서 최대 길이를 제한하고 있으며 URL 형식에 맞지 않는 파라미터 이름이나 값..

2022.02.08

form 유효성 검사

form을 이용한 회원가입 시 사용되는 유효성 검사 버튼 타입 submit 사용 시, 버튼을 클릭하지 않아도 체크할 수 있으며 input에 required를 넣어주면 좋다. insert.php ex1.html 아이디 *8자 이내로 만들어주세요 패스워드 패스워드 재확인 ex2.html (정규식표현) 문자열.chaAt(index) 문자열에서 인덱스에 해당하는 문자 하나를 리턴 문자열.search() 문자열에서 괄호 안의 값이 있는지 검색하여 값이 있으면 0을 리턴, 없으면 -1을 리턴 /[0-9}a-z|A-Z|ㄱ-ㅎ|ㅏ-ㅣ|가-힝]/ 한글, 영문, 숫자를 표현하는 정규식 아이디 * 한글+영문+숫자만 입력가능 ex3.html (이메일 검사) 문자열.indexOf("@"); 문자열에서 특정 문자를 찾아 그 인덱..

2022.02.07

form 이름,패스워드 검사

이름 5자 이상 입력 검사 window.onload=function(){ var elUsername = document.getElementById('username'); // input 지정 var elMsg = document.getElementById('feedback'); // 피드백이 나올 곳 지정 function checkUsername() { // 함수 생성 if (this.value.length < 5) { elMsg.textContent = 'Username must be 5 characters or more'; } else { elMsg.textContent = ''; } } elUsername.addEventListener('blur', checkUsername, false); // 함..

2021.12.03

HTML5 새로운 폼 요소

1. input 요소 HTML5 에서는 강력한 form 속성을 지원한다. 때문에 어려운 스크립트 없이도 다양한 ui를 표현할 수 있다. 이메일 입력을 위한 email 리소스 주소 입력을 위한 url 일정한 범위의 숫자를 입력받기 위한 number * min - 범위의 최소 값 * max - 범위의 최대 값 * step - 벙뮈 이동의 크기 일정한 범위의 숫자를 입력받기 위한 range * min - 범위의 최소 값 * max - 범위의 최대 값 * step - 벙뮈 이동의 크기 날짜를 입력받기 위한 date 검색을 위한 search 전화번호 입력을 위한 tel 색상 입력을 위한 color 2. output요소 output 요소는 사용자가 입력을 받기 위한 요소가 아니라 서식에서 출역용으로 사용하는 요소이..

2021.11.11