<dialog>~</dialog>
dialog(ダイアログ)要素は閲覧者が操作可能なダイアログを表します。
dialog要素で使用できる属性
グローバル属性
すべてのHTML要素で使用できる属性になります。
open属性
属性値は論理属性。
open属性は、details要素、およびdialog要素において、初期状態で展開された状態を指定する。
open属性が指定されたdetails要素の内容、dialog要素は初期状態で表示され、閲覧者が操作可能です。open属性が指定されていないdetails要素は初期状態で内容が折りたたまれ、dialog要素はレンダリングされない。
使用例
<body>
<dialog id="dialog">
<p">ダイアログが表示されました!</p>
<button type="button" onclick="document.getElementById('dialog').close();">ダイアログを閉じる</button>
</dialog>
<button type="button" onclick="document.getElementById('dialog').show();">ボタンを押すとダイアログを表示</button>
</body>
表示