[JS] 코멘트 추가 기능

목표

댓글 내용 입력 후 Enter press, 혹은 게시 버튼 클릭 시 댓글 추가 기능

코드

const listCmt = document.getElementById('listCmt');
const inpCmt = document.getElementById('inpCmt');
const btnSubmitCmt = document.getElementById('btnSubmitCmt');

function createComment() {
  const liEl = document.createElement('li');
  if (inpCmt.value !== '') {
    liEl.innerHTML = `
      <span class="cmt-user">canon_mj</span>
      <span class="cmt-cont">${inpCmt.value}</span>
    `;
    listCmt.appendChild(liEl);
    inpCmt.value = '';
  }
}

btnSubmitCmt.addEventListener('click', createComment);
inpCmt.addEventListener('keydown', (e) => {
  if (e.keyCode === 13) {
    createComment();
  }
});

구현 과정

로그인 상황은 고려하지 않고 댓글 내용이 입력 된 후,
Enter press 혹은 게시 버튼 클릭시 내용이 리스트에 추가 될 수 있도록 구현하였다.

시연 영상