div中移除和添加元素

在进行数据显示时,有时需要关闭某些数据的显示窗口,将最为关注的数据进行突出显示这就需要动态的改变div中数据的显示情况。

首先设置两个div模块并对其id属性进行设置

例如:

<div id="appContainer">

<div class="container" id="container">
      <div id="tableDiv"></div>
</div>

</div>

 

 

然后在js中获取两个元素

 const appContainer = document.getElementById("appContainer");
 const container = document.getElementById("container");

可以定义一个按钮用于触发移除事件,

 const btn_close_Table = document.getElementById("close_table");
      btn_close_Table.addEventListener("click",function(){
        //移除container
        appContainer.removeChild(container)
    //添加container
     //appContaine.appendChild(container)
})

 

上一篇:Element-ui中弹层close事件重置表单数据


下一篇:文件读取与存储