Dom中新增和删除标签

创建一个新的标签

<body>
    <div class="app">ace</div>
</body>

现在页面上有一个div标签,我想要在这个div标签里用js再创建一个标签。
创建标签用createElement() ,同样也要用一个新的变量来接收它

<script>
let div = document.createElement('div')
div.innerHTML = 'simba' //添加内容
div.classList.add('demo') //添加class属性
document.body.appendChild(div) //将此div放到body的末尾
</script>

尤其不能把最后一句忘了,标签创建好了以后要用appendChild()加到页面中去
经过上面的代码执行解释后,页面就变成了这样

<body>
    <div class="app">ace</div>
    <div class="demo">simba</div>
</body>

删除标签

删除一个标签,用标签.remove() 就可以将其删除

  <script>
 let ace = document.querySelector('.app')
 ace.remove()//删除此标签
  </script>

执行完上面的代码段以后,html页面就变成了

<body>
    <div class="demo">simba</div>
</body>
©️2020 CSDN 皮肤主题: 数字20 设计师:CSDN官方博客 返回首页