一、今日完成的情况

1、小课堂PPT上传反复出错，又折腾了一早上，很奇怪，同样的方法上传，第一次多上传了一个demo文件夹，结果有冲突，然后第二次删掉demo文件夹，重新上传就成功了......

2、对技能树首页页面进行重构，拆分组件库。

二、明天的计划

1、继续任务十四。

2、学习JS基础知识。

三、遇到的问题

任务思路不太清晰，看了一些关于模快化、组件化的文章，众说纷纭，搞的有点不明所以。从零开始，组件自己的组件库，明显不可能，仔细看了看任务要求，学习现成的组件库，并拆分组件块和模块，想到是不是指技能树官网首页？看了半天官网首页的代码，太复杂了，而且官网的导航栏与轮播还是用的bootstrap框架来设置的，那还是应该去看bootstrap吧，最后下载了bootstrap的源码。

解决办法：现在的思路就是，把复杂的bootstrap关于布局、导航栏还有轮播图等等任务中需要用到的部分，拆出来形成一个简单的组件库来使用。明天先按照这个思路试着拆分，拆分成4个大模块（1）header部分；（2）footer部分；（3）导航栏部分；（4）首页的轮播图部分；（5）页面的整体框架和默认设置。还有就是对页面默认样式进行重置，下载了normalize.css，引入到页面文件中，进行样式重置。

四、收获

     1、 昨天初步了解了JavaScript事件 ，今天对具体的几种事件进行学习。

（1）Click 事件： 此事件是在一个对象上按下然后释放一个鼠标按钮时发生。它也会发生在一个控件的值改变时。 对一个 Form 对象来说，该事件是在单击一个空白区或一个无效控件时发生。对一个控件来说，这类事件的发生是当单击控件对象的特定区域。

（2）keyup 事件：该完整的 key press 过程分为两个部分，按键被按下，然后按键被松开并复位。当按钮被松开时，发生 keyup 事件。它发生在当前获得焦点的元素上。keyup() 方法触发 keyup 事件，或规定当发生 keyup 事件时运行的函数。

（3）submit 事件：当提交表单时，会发生 submit 事件。该事件只适用于表单元素。submit() 方法触发 submit 事件，或规定当发生 submit 事件时运行的函数。

（4）focus  事件：当元素获得焦点时，发生 focus 事件。当通过鼠标点击选中元素或通过 tab 键定位到元素时，该元素就会获得焦点。focus() 方法触发 focus 事件，或规定当发生 focus 事件时运行的函数。

2、JavaScript 函数

（1）定义：函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。

（2）语法：function functionname(){这里是要执行的代码}；函数就是包裹在花括号中的代码块，前面使用了关键词 function：。当调用该函数时，会执行函数内的代码。可以在某事件发生时直接调用函数（比如当用户点击按钮时），并且可由 JavaScript 在任何位置进行调用。需要注意的是：JavaScript 对大小写敏感。关键词 function 必须是小写的，并且必须以与函数名称相同的大小写来调用函数。

3、JS如何获取Dom属性的值？

（1）什么是Dom：文档对象模型（Document Object Model），是W3C组织推荐的处理可扩展置标语言的标准编程接口。简单理解就是HTML DOM 是关于如何获取、修改、添加或删除 HTML 元素的标准。我们用JavaScript对网页进行的所有操作都是通过DOM进行的。

（2）JS获取DOM元素的方法：1>.通过ID获取（getElementById）; 2>.通过name属性（getElementsByName）; 3>.通过标签名（getElementsByTagName）; 4>.通过类名（getElementsByClassName）; 5>.获取html的方法（document.documentElement）; 6>.获取body的方法（document.body）;7>.通过选择器获取一个元素（querySelector）; 8>.通过选择器获取一组元素（querySelectorAll）。

任务进度：

任务十四—十五

任务开始时间：

2018.5.29

任务完成时间：

2018.6.4

禅道：http://task.ptteng.com/zentao/project-task-714.html