오늘이라도

6. 입력 양식 <form> 본문

취업성공패키지 SW 개발자 교육/View

6. 입력 양식 <form>

upcake_ 2020. 3. 10. 18:26
반응형

https://github.com/upcake/Class_Examples

교육 중에 작성한 예제들은 깃허브에 올려두고 있습니다. 


▲예제 01. 입력 양식 <form>

 - <form></form> 태그는 사용자에게 입력받는 공간을 만드는 태그이다.

 - <input /> 태그는 form 태그 안에 들어가는 요소를 만드는 단독 태그이다.

 - form 태그에 method="post" 속성으로 주소 표시줄에 입력 내용이 보이지 않게 할 수 있다.

 

 

▲예제 02. 여러 input type과 value, onclick

 - input type 에는 text, button, checkbox, file, image, radio, submit, reset, password 등등이 있다.

 - onclick 속성은 해당하는 input 태그를 클릭했을 때 발생하는 일을 제어할 수 있다.

 

 

▲예제 03. <label>태그와 name 속성, value 속성 활용

 - input 태그를 작성할 때 name과 id 속성을 적는 것을 습관화하는 것이 좋다.

 - name 태그를 중복시키면 둘 중 하나를 선택하게 할 수 있다.

 

 

▲예제 04. button에 링크 이동 넣기

 - required 속성은 이 칸을 채워야 submit이 활성화되게 한다.

 - onclick 속성의 값에 "location.href='주소'"를 넣음으로써 클릭했을 때 해당 주소로 이동되게 할 수 있다.

반응형