HTMLダイアログ要素を使用して、JavaScriptを使用してその要素モーダルを開閉できます。例：

「html

    <ダイアログID = "modaldialog">
      <h1>テストタイトル</ h1>
      <ボタンID = "closemodalbtn">モーダルを閉じる</button>
    </ダイアログ>

    <ボタンID = "OpenModalBtn">モーダルを開く</button>

    <スクリプト>
      const openmodal = document.queryselector（ "#openmodalbtn"）
      const closemodal = document.queryselector（ "#closodalbtn"）
      Consta Modal = document.QuerySelector（ "#modaldialog"）
      openModal.AddeventListener（ "click"、（）=> {
        modal.showmodal（）
      }）
      closemodal.addeventlistener（ "click"、（）=> {
        modal.close（）
      }）;
    </script>

``
Puedes usar el elemento dialog de html, utiliza javascript para abrir y cerrar dicho elemento en forma modal. Ejemplo:

```html

    <dialog id="modalDialog">
      <h1>Título de prueba</h1>
      <button id="closeModalBtn">Cerrar el modal</button>
    </dialog>

    <button id="openModalBtn">Abrir el modal</button>

    <script>
      const openModal = document.querySelector( "#openModalBtn" )
      const closeModal = document.querySelector( "#closeModalBtn" )
      const modal = document.querySelector( "#modalDialog" )
      openModal.addEventListener( "click", () => {
        modal.showModal()
      } )
      closeModal.addEventListener( "click", () => {
        modal.close()
      } );
    </script>

```