【Web APIs】JavaScript 操作元素 ⑥ ( 关闭对话框案例 | display 属性简介 | 页面标签结构和样式 | 盒子模型细节 | 绝对布局要点 - 设置负值即可超出父容器模型 )
// 获取元素
var closeBtn = document.getElementById('closeBtn');
var dialog = document.getElementById('dialog');
// 为关闭按钮绑定点击事件处理函数
closeBtn.onclick = function() {
// 关闭对话框
dialog.style.display = 'none';
};
这段代码首先通过getElementById
获取了页面上的关闭按钮和对话框元素。然后为关闭按钮绑定了点击事件处理函数,在该函数中通过设置对话框的style.display
属性为'none'
来隐藏对话框。这是一个简单的例子,展示了如何使用JavaScript操作元素的CSS属性来控制元素的显示和隐藏。
评论已关闭