这次课程分为四个部分 这个是前两部分
HTML CSS JavaScript各司其职
简单的黑夜白天模式的代码讲解 实现这个功能代码有很多不同的写法 讲解了各个写法的不同之处 让我们理解了各司其职的意思 也明白了重要性 对我以后写代码的思路还是有一些启发的 虽然看起来好像行数差不多 但是里面的内容还是完全不一样的
组件封装
组件是指web页面上抽出来一个个包含模板(HTML)、功能(JS)和样式(CSS)的单元。好的组件具备封装性、正确性、扩展性、复用性。 ui组件轮播图 第一步 定义一个html结构 用一个无序列表的结构 用css的绝对定位 API 定义一个叫slider的类
结构（HTML）表现（css) 行为:js、控制流
轮播图是一个典型的列表结构，用一个无序列表元素ul来实现 使用css绝对定位将图片重叠在同一个位置 轮播图切换状态用修饰符modifier 切换动画使用CSS transition API 满足灵活性 控制流：用自定义事件来解耦。
总结：组件封装的基本方法：结构设计、展现效果、行为设计（功能、控制流）。
解耦：将控制元素抽取成插件 插件与组件之间通过依赖注入的方式建立联系（这个解耦是之前没有接触的概念） 抽象：将通用的组件模型抽象出来 组件设计的原则：封装性、正确性、扩展性、复用性 实现组件的步骤：结构设计、展现效果、行为设计 三次重构：插件化、模板化、抽象化
