这是我参与「第四届青训营 」笔记创作活动的的第5天

---

概念： 一门客户端脚本语言

         运行在客户端浏览器中的。每一个浏览器都有JavaScript的解析引擎。
脚本语言：不需要编译，直接就可以被浏览器解析执行了。

功能：

     可以来增强用户和html页面的交互过程，可以来控制html元素，让页面有一些动态的效果，增强用户的体验。
     

1. 1992年，Nombase公司，第一门客户端脚本语言，用于表单的校验。命名为 ： C--      ——>     ScriptEase
2. 1995年，Netscape公司，开发了一门客户端脚本语言：LiveScript。与SUN公司合作开发，修改LiveScript，命名为JavaScript
3. 1996年，微软开发出JScript语言
4. 1997年，ECMA(欧洲计算机制造商协会)，制定出客户端脚本语言的标准：ECMAScript，统一了所有客户端脚本语言的编码方式。
    

那么html、css、JavaScript应该如何配合呢？

• 三者应该各司其职
• HTML决定结构 css决定样式 Javascript决定行为
• 应当避免不必要的由js直接操作样式
• 可以用class表示状态
• 纯展示类交互寻求零js方案

组件封装

组件是指web页面上抽出来一个个包含模板（HTML）、功能（JS）、和样式（CSS）的单元。好的组件具备封装性、正确性、拓展性、复用性。

JS是由：ECMAScript、DOM、BOM组成。

• ECMAScript:描述了该语言的语法和基本对象。
  

• BOM（文档对象模型）:处理网页内容的方法和接口。
  

• DOM（浏览器对象模型）:与浏览器进行交互的方法和接口。
  

BOM:

1. 概念：Browser Object Model 浏览器对象模型
	* 将浏览器的各个组成部分封装成对象。

2. 组成：
	* Window：窗口对象
	* Navigator：浏览器对象
	* Screen：显示器屏幕对象
	* History：历史记录对象
	* Location：地址栏对象

DOM

概念： Document Object Model 文档对象模型
	* 将标记语言文档的各个组成部分，封装为对象。可以使用这些对象，
                                   对标记语言文档进行CRUD的动态操作

主要对象：
		* Document：文档对象
		* Element：元素对象
		* Attribute：属性对象
		* Text：文本对象
		* Comment:注释对象

	* Node：节点对象，其他5个的父对象
	* XML DOM - 针对 XML 文档的标准模型
	* HTML DOM - 针对 HTML 文档的标准模型

组件封装的三次重构

• 插件化：将控制元素抽取成插件、插件与组件之间通过依赖注入方式建立联系。
• 模板化：将HTML模板化，更易于kuoz。
• 抽象化（组件框架）：将组件通用模型抽象出来。

总结

JS和Java有着很多相似的特点，可以定义各种函数，将很多算法运用到web页面的人机交互上，值得我们学习。