Как в js при нажатии на кнопку (button) сделать так, чтобы появлялось диалоговое окно?

Окно невидимое. При нажатии становится видимым

Сверстать диалоговое окно, дать ему display: none или класс с этим свойством. При нажатии на кнопку переключать свойство или удалять этот класс. При нажатии на крестик снова добавлять.

1) На кнопку нужно повесить обработчик
2) Сверстать что-то вроде модального окна

Ну вообще в чистом браузером API есть такая функция, как confirm()...

 // Получить кнопку
const button = document.querySelector('button'); 

// Привязать на кнопку новое событие клика мышкой
button.addEventListener('click', () => {

   // Задать вопрос и записать true или false в переменную
   const nani = confirm('Я милый?');

   // Добавить какую-то логику
   if (nani === true) {
      console.log('<3');
   } else {
      console.log('BAKA!');
   }

}); 

Если тебе такого диалогового окна недостаточно, то в чистом браузером API еще есть функция prompt()... она запрашивает текст, но работает аналогично.

Если тебе и этого недостаточно, то это уже не диалоговое окно, а модальное окно. Его нужно писать вручную, и без использования библиотек задача не для новичка.