这是我参与「第五届青训营 」伴学笔记创作活动的第 2 天。 今天是跟着月影学js，主要讲了三个点： 1.各司其职 需要每个函数要有自己独立的功能，方便各个函数的之间的调用 2.封装 封装函数可以大大节省代码量 3.过程抽象 过程抽象就是吧问题转化，比如画成图。 代码的优化：在白天黑夜模式转化的案例中，可以在两个代码中写入2种表现方式，也可以在css中把两个表现形式写出来，然后再该类名，这种方式更可以提高代码的可读性，也便于维护，此外，也可以把所有的交互。
js学习： 1.结点分为标签结点，文本节点，属性节点，可以通过nodeType来判断 2.parent.childNode是得到父节点的所有子节点，firstchild设计第一个子节点，其中firstElementChild是第一个元素结点，在实际开发中多parent.children【i】来查找子结点，nextSibling是兄弟节点。 3.添加结点：parent.appendChild(li)但是要先创建结点：document.createElement。 4. node.cloneNode()方法返回调用该方法的结点的一个副本。也称为克隆节点或者拷贝节点。括号里面为空或者false为浅拷贝，只复制结点不复制内容。括号里面为true为深拷贝，复制节点，复制内容 5.删除结点：node.removeChild()方法从DOM中删除一个子节点，返回删除的结点。 6. querySelectorAll()和getElementsByTagName()两者的主要区别就是返回值。前者返回的是NodeList集合，后者返回的是HTMLCollection集合。其前者是一个动态集合，后者是一个静态集合。 其中动态集合和静态集合的最大区别在于：动态集合指的就是元素集合会随着DOM树元素的增加而增加，减少而减少；静态集合则不会受DOM树元素变化的影响。 使用getElementsByTagName方法我们得到的结果就像是一个对象的索引，而通过querySelectorAll方法我们得到的是一个对象的克隆；所以当这个对象数据量非常大的时候，显然克隆这个对象所需要花费的时间是很长的。
