今天完成的事情:

1.开始任务14；

2.学习组件库；

3.了解js基础知识

    明天计划：

1.继续写任务14；

2.了解BFC；

3.巩固前面的知识；

    遇到的问题：

今天主要在写整体页面布局，暂无问题；

    收获总结：

  1.flex布局中容易疏忽的问题：

flex简单实用，但是不注意一些小细节的话在使用的时候容易出现问题；

1.随着flex-direction的改变，其他的一些属性也跟着改变，在应用flex的时候，我们应该要注意一下justify-content,align-content,align-items这些属性是相对于主轴的位置来定义的，flex-direction的属性发生了变化，也就是主轴的位置发生了变化，自然这些属性也发生了改变。

2.flex的子元素不受float的影响；

3.不能在display中嵌套position：absolute、relative，这样会导致布局会失效；

4.flex-wrap的默认值nowrap，我们需要设置才会自动换行；

2.学习组件库与组件化的相关知识：

组件库是有用功能的有组织的集合。典型功能包括处理字符串，日期，HTML DOM元素，事件，Cookie，动画，网络请求等。

组件化是一种化繁为简的思想，当某个部件出现问题时，不需要将整体都进行维修，只需要将坏的部件拿下来，维修之后再将其组合上就可以了。

组件应该遵守的个原则：

标准性 ：任何一个组件都应该遵守一套标准，可以使得不同区域的开发人员据此标准开发出一套标准统一的组件。 

组合性 ：组件之前应该是可以组合的。我们知道前端页面的展示都是一些HTML DOM的组合，而组件在最终形态上也可以理解为一个个的HTML片段。那么组成一个完整的界面展示，肯定是要依赖不同组件之间的组合，嵌套以及通信。

 重用性 ：任何一个组件应该都是一个可以独立的个体，可以使其应用在不同的场景中。

可维护性 ：任何一个组件应该都具有一套自己的完整的稳定的功能，仅包含自身的，与其它组件无关的逻辑，使其更加的容易理解，使其更加的容易理解，同时大大减少发生bug的几率。

CSS，JS各有哪些流行的组件库：

Bootstrap   ：我们现在接触的最多的就是bootstrap了，bootstrap是一种简洁，直观，强悍的前端开发框架，让web开发更迅速。

 Foundation：基金会提供了仅有限的几种元素，其目标是，即使你使用预定义的UI元素，也不应该与大家的网站长得太像。而引导则致力于提供所有定义好的元素，这样使得看起来许多网站都差不多。基础默认不带图标集，它推荐使用开源字体图标。

jQuery ：jQuery是最常用的JavaScript库，它革命性的在客户端开发，将CSS选择器引入到DOM节点检索加链接来应用事件处理程序，动画和Ajax调用。

阵营：阵营起源于实的内部项目，因为该公司对市场上所有的JavaScript的MVC框架，都不满意，就决定写自己 一套，用来架设的Instagram的的网站。

3.学习js基础知识：

      JS的组成：

•  ECMAScript(定义了JS的基本语法,命名规范,操作语句,变量,数据类型等最基础最核心的知识)
•  DOM(document object model 文档对象模型) 提供了JS操作页面上元素的常用属性和方法
•  BOM(browser object model 浏览器对象模型) 提供了JS操作浏览器的常用属性和方法

JS中的输出方式

　　1、alert(要输出的内容); 在浏览器中弹出一个框，在框中有我们要输出的内容（不管最后输出什么内容，输出的都是字符串内容）

　　2、confirm：在浏览器中弹出一个提示确认框（confirm("确定要删除吗?")）

　　3、console.log(要输出的内容); 按F12在控制台中的console页卡中显示（一般用于调试，不会影响页面中的内容）

　　4、console.dir：他只是比.log输出的内容更加详细一些

　　5、console.table：他能把我们需要查看的数据在控制台中以一个表格的形式展示出来

　　6、document.write(我们要输出的内容); 直接显示在页面中，不停的输出

　　7、innerHTML/innerText 动态的向指定的元素中添加内容