childNodes和children的区别

我前一篇文章提到了，今天使用印象笔记和马克飞象来做笔记，并提到了Markdown编辑器，这篇childNodes和children的区别笔记，就是我把的写文章编辑模式由“富文本模式”换成了“Markdown”模式而写的，对于我们这些新手来说，记笔记，特别是有代码块的地方，使用Markdown编辑，一目了然。当然了，对于大神，已经深知Markdown的当我什么没说，略过就好。废话不多说，下面进入正题：

我们都知道，当我们想要知道一个标签里面有多少子节点的时候，都是使用childNodes来查看。如下面代码（查看ul的子节点）：

这就是使用childNodes带来的问题，当然了，我们可以借助nodeType来解决这个问题。通过判断节点的nodeType来得到我们想要的结果，(因为文本节点的nodeType值等于3，而元素节点的nodeType值等于1)，代码如下：

上面，我们了解到了childNodes因为浏览器版本的不同，给我们带来的麻烦。虽然借助nodeType可以解决我们的麻烦。但是，有更方便的方法吗？答案是：当然有。它就是children。children和childNodes最大的区别是，无论什么浏览器使用，都不会把空白节点算进去，也不需要nodeType来帮助判断，直接使用。当我们要实现上面的效果时，使用children，不需要借助nodeType来做判断，代码如下：

好吧，看完他们的区别后，我们来做个总结，经过上面的比较，相信大家也大概能猜到了childNodes和children的区别了，他们的区别就是childNodes包括元素节点和文本节点，而children只包括元素节点。所以，当我们使用时，需要使用哪个，不用多说，大家也能知道了。