본문 바로가기

프로그래밍 수업 정리 HTML

HTML 프로그래밍 3/23 다섯번째(submit/reset과 button 차이)

오늘은

  1. submit/reset과 button의 차이
  2. button에 행동 넣기(간단예제)
  3. 파일 추가 태그
  4. autofocus
  5. placeholder
  6. required

를 배웠다.

 

 

 

1.submit/reset과 button의 차이

 

input type =" submit/reset " → 이미 동작이 구현되어진 버튼이다.

input type =" button " → submit과 reset과는 다르게 동작이 구현되어 있지 않는다.

                  (Javascript를 이용해서 동작구현 가능)

                  버튼에서 html로도 간단하게 동작을 만들 수 있다.

 

 

 

 

2.button에 행동 넣기(간단한 예제)

 

간단하게 버튼에 동작을 넣은 코드이다.

onclick → 버튼을 눌렀을때 발생하는 event를 말한다.

window.open → window를 새로 여는 event이다. javascript로 미리 구현되어 있는 동작이다.

 

 

 

 

3.파일추가 태그

파일을 추가하는 태그이다.

 

 

태그

 

실행화면

 

 

 

4.autofocus

자동으로 입력커서 위치시키는 태그이다.

 

 

코드

 

실행화면

 

 

 

5.placeholder

입력창에 설명할 것을 보여주는 태그이다.

 

코드

 

실행화면

 

 

 

6.required

필수 입력창을 지정하는 코드이다.

 

코드

 

실행화면

위 화면처럼 required를 쓰면 빈칸을 안채웠을 때 안내창이 뜬다.