一、JavaScript好代码的标准

A.写好JS的一些原则

1. 各司其职

   1. 让HTML/CSS和JavaScript职能分离

2. 组件封装

   1. 好的UI组件具备正确性、扩展性、复用性

3. 过程抽象

   1. 应用函数式编程思想

二、HTML/CSS/JS各司其责

A.案例：网页深色与浅色怎么做

1. 版本一

   1. 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.targer.innerHTML === '🌜';
          }else{
              body.style.backgroundColor = 'white';
              body.style.color = 'black';
              e.targer.innerHTML === '☀️';
          }
      });
      

2. 版本二

   1. const btn = document.getElementById('modeBtn');
      btn.addEventListener('click', (e) => {
          const.body = document.body;
          if(body.ClassName !== 'night'){
              body.ClassName = 'night';
          }else{
              body.ClassName = '';
          }
      });
      

3. 版本三：只用HTML和CSS

B.结论

1. HTML/CSS/JS各司其职
2. 应当避免不必要的由JS直接操作样式
3. 可以用class来表示状态
4. 纯展示类交互寻求零JS方案