Javascript - EventListener를 활용하여 Enter키로 댓글 작성, 버튼으로 댓글 초기화하기

EventListner를 활용한 HTML 수정을 구현해보았습니다.

Enter키를 입력하여 댓글을 추가, 버튼을 클릭하여 댓글을 초기화합니다.

 

- 작성코드 - 

 

See the Pen Untitled by duglikespiano (@duglikespiano) on CodePen.

 

 

1. Enter키를 입력하여 댓글을 추가

 

댓글입력란에 Enter키 감지이벤트를 등록하였습니다.

Enter키가 감지 될 시 하기 이벤트가 발생합니다.

 

댓글이 들어 갈 div 생성

↓

생성 된 div에 댓글입력란의 입력값을 삽입

↓

내용이 삽입 된 div를 지정 된 위치에 삽입

↓

댓글입력란 초기화

↓

끝

 

 

2. 버튼으로 댓글 초기화

 

Reset comments 버튼을 클릭 시 모든 댓글이 초기화 됩니다.