홈페이지는 대부분 마우스의 클릭과 키보드의 타이핑으로 동작을 합니다.
클릭을 하기 위해선 버튼이 있어야 하고
타이핑을 하기 위해선 텍스트 필드가 있어야 합니다.
그래서 이번시간에는
JSP 의 가장 기초 중 하나인
input type 들과
가장 많이 쓰이는 태그 중 하나인 a 태그에 대해서 알아보겠습니다.
위의 사진은 https://www.w3schools.com/tags/att_input_type.asp
사이트에서 퍼온 현재 제공되는 input type 들입니다.
개발을 하다 보면 구글링을 통해 영어로 된 문서를 읽어야 할 때가 정말 많습니다.
지금부터라도 영어공부와 병행하시는걸 진심으로 추천해드립니다.
저기 제공되는 태그들 중
5자로 슈퍼맨같은 마크가 박혀있는 타입들은
html5 버전에서 새롭게 제공되는 태그들입니다.
사실 많이 쓰이지도 않고 표준에 맞게 개발을 하다보면 쓰고싶어도 쓰지 못할때가 종종 있으니
저 마크가 없는 중요하고 자주 쓰이는 타입들 위주로 살펴보겠습니다.
<body></body> 사이에 저렇게 코드를 써준 뒤 저번처럼 실행시켜주게되면
위와같은 화면이 출력되게 됩니다.
하나씩 설명을 해드리자면
1. text : 말 그대로 텍스트를 입력할 수 있는 타입입니다. 여기에 입력된 텍스트들을 value 에 담아서 사용할 수 있습니다.
2. button : 눌렀을 때 어떠한 이벤트들을 발생시킬 수 있는 가장 기본적인 태그입니다.
3. checkbox : 여러개의 선택지 중 여러개를 선택할 수 있도록 하는 체크박스 입니다.
4. file : 첨부파일을 생각하시면 됩니다. 파일선택 버튼을 클릭 시 내 컴퓨터의 파일 하나를 첨부할 수 있습니다.
5. hidden : 숨겨진 태그입니다. 어떠한 값을 숨겨놓고 사용하고 싶을 때 사용하시면 됩니다.
6. password : 비밀번호 입니다. 보시는것과 같이 타이핑을 해도 검은 동그라미로만 표시가 됩니다.
7. radio : 여러개의 선택지들 중 하나만 선택할 수 있는 라디오박스입니다.
8. submit : 확인, 혹은 제출의 의미로 생각하시면 되겠습니다. 버튼을 눌렀을 때와 거의 동일하게 사용되지만, 해당 태그가 쌓여져 있는 폼의 속성에 의해 움직이게 됩니다.
9. reset : 초기화 버튼입니다. 예를들면 텍스트 타입에 글을 입력하다가 reset 버튼을 누르게 되면
작성하던 텍스트를 모두 지우고 초기화 시킬 수 있습니다.
이러한 타입들이 자바스크립트, 혹은 제이쿼리와 같은 언어들에 의해 기능이 추가되고 이벤트가 발생하게 되면 동작들을 하게 됩니다.
다음은 input type 은 아니지만 가장 기본적이고 가장 많이 쓰이는
a 태그 입니다.
이런식으로 <a href="" ></a> 와 같은 형식으로 사용을 해주게 되고
위의 코드를 실행시켜보면
위와 같은 파란글씨로 밑줄이 쳐진 태그가 생성이 되게 됩니다.
저 글씨를 클릭하면 href 위에 적혀진 주소로 이동을 할 수 있게 됩니다.
가장 간단하면서도 기본적인 태그들에 대해 알아봤으니
다음시간에는 간략하게 태그들이 어떻게 동작하는지 알아보겠습니다.
'개발 > 웹개발 기본가이드' 카테고리의 다른 글
| MVC 패턴에 대하여 (0) | 2019.02.24 |
|---|---|
| 기본 태그 사용법 input type button, text, hidden, 버튼이벤트 value 가져오기 (0) | 2019.01.31 |
| 3. 웹개발의 시작 (2) | 2019.01.23 |
| 2. 이클립스에서 개발환경 설정하기 (0) | 2019.01.21 |
| 1. 개발환경 세팅(3) 아파치 톰캣 apache tomcat 설치 및 환경변수 설정 (4) | 2019.01.17 |