[Javascript] Modal 창 조작하기

부트스트랩을 통해 사용하는 모달은 Jquery를 사용하면 .modal('show'), .modal('hide') 를 통해 간단하게 모달을 띄우고 지울 수 있다.

 

$('#myModal').modal('show');
$('#myModal').modal('hide');

 

 

그에 반해 바닐라 자바스크립트는 bootstrap.Modal 이라는 객체를 생성해서 조작하여야한다. (생성자의 두번째 파라미터인 중괄호 안에는 옵션을 넣을 수 있다.)

 

let myModal = new bootstrap.Modal(document.querySelector('#myModal'), {});
myModal.show();
myModal.hide();