浅谈dom操作removechild（）

浅谈dom操作removechild（）

作为一个从ui设计转向前端的小白，之前一直是在对自己设计的界面写html和css，极少去写js，刚刚把盒子模型和响应式布局这一块的东西有了一点理解，又开始学习起js方面的内容，希望能在实习之前学到更多东西。

刚学习js就对里面的dom操作很感兴趣，在自己编写代码和修改bug过程中，对removechild（）这个dom操作有了更深的理解，比如编写一个表格table，包含多个tr，需要删除某个tr，设计师在tr中添加了一个删除按钮，是个最底层节点，需要删除顶点tr，google之后找到这样几个方法，一个是用@click.prevent遍历后使用display：none改样式（似乎这个方法很万能，使节点消失看不见就可以），但这样写并没有使该节点在节点数中被删除，数据依然在节点树中，只是没有显示给用户看，另一个方法removechild()官方给出的解释是删除一个子元素，（一个子元素？随机的还是连续点击从第一个一次删除），经过测试是可以循环点击删除所有的，好在设计师设计的界面删除按钮在tr中，点击删除时删除所在的一行会直接从节点树中被删除，但同样有个问题是删除是最底部的节点，怎么才能回到最上层tr呢？

这就需要另一个dom操作parentNode，parentNode的官方文档是说返回元素的父节点可以通过不断返回上层，注意需要回到需要删除的tr的上层，也就是tbody部分，因为removechild()的用法是删除子节点，这两个dom操作配合就可以完成某一tr从节点树中删除，经过不断测试和console.log(tr.parentNode)没有发现bug。

写完后发现dom操作确实很神奇，removeChild只是众多dom操作中的一个，多操作的配合可能还会产生更多的效果，对于我这个前端小白来说，js确实很神奇，希望广大前端小白们能够多敲代码，欣赏代码之美，我们一起努力，早日拿到自己心仪公司的offer