如何弹出 html 元素？创建 html 元素；2. 创建 JavaScript 函数显示和隐藏元素；3. 绑定事件监听器触发弹出；4. 允许用户关闭窗口。
如何使用 JavaScript 弹出 HTML
当需要在当前网页上显示附加内容或用户交互时，可以使用 JavaScript 弹出 HTML 元素。以下是弹出 HTML 的步骤：
1. 创建 HTML 元素：
使用 HTML 创建要弹出的元素，例如模态窗口、提示框或表单。
<div id="myModal"> <h1>弹出窗口</h1> <p>这是弹出窗口的内容。</p><p><span>立即学习</span>“<a href="https://pan.quark.cn/s/cb6835dc7db1" style="text-decoration: underline !important; color: blue; font-weight: bolder;" rel="nofollow" target="_blank">前端免费学习笔记（深入）</a>”；</p> </div>
2. 创建 JavaScript 函数：
编写一个 JavaScript 函数来显示和隐藏弹出的元素。
function openModal() { document.getElementById("myModal").style.display = "block"; } function closeModal() { document.getElementById("myModal").style.display = "none"; }
3. 绑定事件监听器：
使用 addEventListener() 方法将事件监听器绑定到触发弹出窗口的元素。
document.getElementById("triggerButton").addEventListener("click", openModal);
4. 关闭窗口：
在允许用户关闭窗口的情况下，可以使用 closeButton 绑定到关闭函数。
<button id="closeButton" onclick="closeModal()">关闭</button>
示例：
以下是一个使用 JavaScript 弹出 HTML 的完整示例：
<script> function openModal() { document.getElementById("myModal").style.display = "block"; } function closeModal() { document.getElementById("myModal").style.display = "none"; } document.getElementById("triggerButton").addEventListener("click", openModal); document.getElementById("closeButton").addEventListener("click", closeModal); </script>
