HTML----从页面结构，语义上描述页面

CSS------从审美的角度装饰页面

JavaScript--从交互的角度提升页面用户体验

交互：就是网页的元素针对用户的特定行为，产生指定的变化。就是响应事件。

一、什么是JavaScript？

（1）JavaScript 是用来实现交互的。

（2）JavaScript是纯文本的，用任何的纯文本编辑器都能够编辑它（记事本，notepad++、editplus、Dw、sublime）

（3）也是网页的一部分，随着html的请求，JavaScript也随之加载到本地，在本地渲染运行的JavaScript 脚本不保密，所有的代码都可以通过查看源代码获取。

（4）JavaScript、PHP、ASP、JSP区别：

    JavaScript和PHP、ASP、JSP完全不同；

           JavaScript是运行在 用户的计算机 中的是前台的脚本；PHP、ASP、JSP是运行在服务器上的

          JavaScript的功能单一，仅仅用来开发页面效果的；PHP等语言可以与数据库交互、开发网站程序的

        有JavaScript的网页是静态网页，不是动态网页（假如一个网页有JavaScript花花绿绿的，他仍然是静态网页，所谓的动态，静态是指：能否与数据库产生交互）；只有PHP、ASP、JSP这些网页，才是动态网页。

二、开发工具sublime

打开sublime，是一个空白文档，此时输入“html:xt”，按住快捷键"Ctrl+E" 即可。

整个框架就构建好了

一些快捷键：

按CTRL+鼠标滚轮：调整字号；

输入div*5,在按Ctrl+E：就能生成5个div盒子模型；

按鼠标中键（即滚轮）：可以多行编辑；

CTRL+shift+K：删除当前行；

CTRL+shift+D：复制当前行；

CTRL+shift+上下键：调整当前行的位置；

CTRL+Alt+[ ：可以让CSS格式进行转换（单行/多行）

三、对象、属性、标题

对象：万物皆对象。

所谓的对象，就是一个物体，一个实体。

对象一定是有一个名字的。在JavaScript中也有很多对象，这些对象是天生存在在JavaScript里面，比如：document是一个对象，window也是一个对象。

JavaScript想调用一个对象，非常的简单，直接打他的名字就行。

每个对象负责的事情不一样：document负责一切和文档相关的事情；window负责一切和浏览器窗口相关的事情。

执行什么事情，就要写找准对象

所有的对象都是名词，“美丽”“可爱”“漂亮”都不是对象。

对象是有类型的，猪八戒、孙悟空、二郎神是一类；西瓜、馒头、蟠桃是一类

属性：属性是描述一个对象的。

所以一提到属性，一定是某一个对象。比如：猪八戒这个对象，就有 年龄、性别、身高、性别等属性；西瓜的属性：大小、颜色、重量。

对象或多或少都有属性，属性的不同，对象的不同。

所有的对象都有属性：document对象，title就是document对象的属性，描述的是文档的标题；window对象，location是window对象的属性，描述的是浏览器当前所在的页面URL。

如果你想更改一个对象的属性，就要用语法：对象。属性=“新的值”；等号表示赋值，将等号右边的值赋予左边。这是一个命令，是命令计算机立即执行的。等号不是表示相等，而是命令

正确的语法：document。cookie=“新的值”；（对象。属性=“新的值”）

方法：就是一个对象能够做的行为。比如：猪八戒有睡觉方法、打怪方法、化缘等行为。

JavaScript 中的对象，也都有一些能够做的事情，也都有一定的方法。

比如：widow 对象就有一个alert方法。window对象能够做alert这个事情

命令一个对象立即执行它的方法   的方法：对象。睡觉（“参数”）；如：猪八戒。睡觉（“5小时”）；那猪八戒就会立即停止手上的工作，进行睡觉。

所谓的“参数”就是一定的配置这个方法的一定的数据。

用户看不见控制台，是为了方便调试程序，我们经常在控制台输出文字。我们要用的对象是 console 对象，调用它的log方法，参数就是要输出的文字，比如：console.log（“哈哈”）

响应事件的一个能力，让一个html元素能够响应事件，就给这个标签加上onclick=“自己起名（）”即可。

四、操作页面元素

事件源：有监听的HTML标签，能响应事件的HTML标签，就是事件源。

事件名：用户的特定行为，比如 onclick。

事件的响应：就是一个个function。

事件的响应，就是function，那么编程就是编写事件的响应。响应中，最重要的就是要想清楚被操作的对象。

第一个程序：点击第一个盒子第二个盒子变蓝；

第一个盒子为事件源，第二个盒子称为被操作对象。

getElementById  —— 通过Id得到元素

document.getElementById("box2").style.backgroundColor= "blue";

现在要让盒子2变蓝，所以就要让JavaScript得到盒子2这个元素。得到元素的方法，就需要通过Ｉd得到它。

document.getElementById("")；这种命名法称为驼峰命名法。

长的一个单词，是由多个单词组成的，第一个单词的首字母小写，之后的每一个单词的字母都大写。很像一个低头吃草的骆驼。

点击一个盒子让另外一个盒子变色。点击谁，谁的身上就有onclick；你要操作谁，谁就必须要有id，书写document.getElementById("")得到它。

找准事件源，用户点击哪个盒子，会有事情发生，这个盒子就是事件源，它身上就有onclick属性，

找准谁是被操作的对象，被操作的对象可能不止一个，并且事件源自己也有可能是被操作的对象，被操作的对象身上一定要有id.

第一次分享跟技术有关的文章，以后会陆续更新，欢迎小伙伴们一起交流，共同进步。