在Web应用程序中，可以使用一些技术来模拟window.showModalDialog效果，比如使用弹出框插件或者自定义模态框。
使用弹出框插件：可以使用一些弹出框插件，比如Bootstrap Modal、jQuery UI Dialog等，这些插件可以让你轻松地创建一个模态框并显示在页面上。例子：
<!-- 引入Bootstrap CSS和JS文件 --><link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"><script src="https://code.jquery.com/jquery-3.5.1.min.js"></script><script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script><!-- 创建一个按钮来触发模态框 --><button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal"> 打开模态框</button><!-- 模态框 --><div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="myModalLabel">模态框标题</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <div class="modal-body"> <!-- 模态框内容 --> <p>这里是模态框内容</p> </div> <div class="modal-footer"> <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button> <button type="button" class="btn btn-primary">保存</button> </div> </div> </div></div>例子：
<button onclick="openModal()">打开模态框</button><div id="myModal" class="modal"> <div class="modal-content"> <span class="close" onclick="closeModal()">×</span> <p>这里是模态框内容</p> <button>保存</button> </div></div><script>function openModal() { document.getElementById("myModal").style.display = "block";}function closeModal() { document.getElementById("myModal").style.display = "none";}</script><style>.modal { display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: white; border: 1px solid black; padding: 20px;}.modal-content { max-width: 300px; margin: auto;}.close { float: right; cursor: pointer;}</style>以上是两种实现模拟window.showModalDialog效果的方法，可以根据实际需求选择合适的方式来使用。
