这是我参与「第五届青训营 」伴学笔记创作活动的第 3 天

在新手第一阶段完成HTML+CSS的学习之后，很多同学都会感觉第二阶段有些难——JS语法、JS数据类型、JS对象，Js会给新手一种复杂的感觉，对于html和css确实是的，因为它相对来说是动态的，是编程语言会更深奥一些，在学习基础语法知识后我们应该有更深一层的思考，那就是如何写好js这门语言，这次青训营的月影老师给了我一些思考和帮助，在学习完月影老师的js系列课程后，我有了一些体会。

首先要清楚它的定位

它的地位属于前端的核心，主要作用是用来操控和重新调整DOM，通过修改DOM结构，从而来达到修改页面效果的目的，没有js，网页就就不能“动”起来。

其次了解老师所讲的如何写好js

学习js的基础知识并不是很难，但如何将js在写项目时运用好，写出高效率可读性强的代码是我们每一个前端人所应该思考的。

const btn = document.getElementById('modeBtn');
btn.addEventListener('click', (e) => {
  const body = document.body;
  if(e.target.innerHTML === '🌞') {
    body.style.backgroundColor = 'black';
    body.style.color = 'white';
    e.target.innerHTML = '🌜';
  } else {
    body.style.backgroundColor = 'white';
    body.style.color = 'black';
    e.target.innerHTML = '🌞';
  }
});

如月影老师贴出的这段代码，我认为存在的一个问题是使用js直接修改元素的css属性过于繁杂，复用性差，可以将白天模式和夜晚模式归为两个类，在修改时直接用js操纵元素的类名即可，这样以后修改时既不复杂，代码可读性也很高。当然也可以仅用css来实现，通过伪类来达成目的，这样体现了这几项技术的“各司其职”，但个人而言我更喜欢使用js来实现这个功能，因为js发明出来就是为了配合网页的，只使用css相比较而言显得复杂，