input 입력 태그 심화
<form>
과 함께 사용하는 <input />
input 태그는 대부분 <form>
(양식폼) 태그와 함께 사용합니다.
예를 들어 회원가입 화면에서 input 태그로 사용자에게 데이터를 입력을 받고, <form>
태그로 입력 받은 데이터를 서버에 전송합니다.
form 태그 활용 예시
<form action="/submit" method="post">
<input type="text" name="username" placeholder="사용자 이름" />
<input type="password" name="password" placeholder="비밀번호" />
<input type="submit" value="제출" />
</form>
입력폼에 대한 더 자세한 내용은 다음 수업에서 다루도록 하겠습니다.
label
태그 활용
label
태그는 input 입력란의 설명이나 제목을 나타냅니다.
label 태그를 사용할 때는 input 태그의 id
속성과 label 태그의 for
속성을 같은 값으로 지정해야 합니다.
label 태그 예시
<label for="username">사용자 이름:</label>
<input type="text" id="username" name="username" />
유효성 검사 (Validation)
유효성 검사는 입력된 정보가 올바른지 확인하는 것을 뜻합니다.
아래 input은 required
속성을 사용해 input이 값을 갖고 있는지 유효성을 검사합니다.
required 활용 유효성 검사
<input type="email" name="useremail" required />
다음 내용이 궁금하다면?
코드프렌즈 PLUS 멤버십 가입 or 강의를 등록해 주세요!