导读 在使用Bootstrap开发网页时，`Modal` 是一个非常实用的功能，可以快速实现模态框弹窗效果。但有时候我们需要向弹窗中传递动态数据，比如用...
在使用Bootstrap开发网页时，`Modal` 是一个非常实用的功能，可以快速实现模态框弹窗效果。但有时候我们需要向弹窗中传递动态数据，比如用户信息或表单内容。今天就教大家如何优雅地完成这项操作！
首先，在HTML中定义一个基础的Modal结构：
```html
```
接着，通过JavaScript动态传值：
```javascript
// 示例：点击按钮时打开Modal并传入用户名
document.querySelector('openModal').addEventListener('click', function () {
const username = '小明'; // 动态获取的数据
document.getElementById('dynamicText').textContent = username;
new bootstrap.Modal(document.getElementById('myModal')).show();
});
```
这样，当你点击触发按钮时，Modal会弹出，并显示动态传入的用户名！🎉
💡 小提示：记得引入Bootstrap的相关CSS和JS文件哦！结合实际项目需求，你可以进一步扩展功能，比如从后端拉取更多动态数据，或者让Modal支持更复杂的交互逻辑。✨