web前端开发第二阶段——javascript基础

一、JS定义

1. 面向对象能力的，解释型的程序设计语言
2. 相对安全性的客户端脚本语句（常见为浏览器）
3. 目的：验证发往服务器端的数据，增加web互动，加强，用户体验度等

二、语言核心和c、c++、java相似

三、JS三大方面

1. 核心（ECMAScript组织）ecma规范 es5
2. 文档对象模型（DOM）
3. 浏览器对象模型（BOM)

四、JS使用

1. 行内：例如 οnclick=“fn()”
2. 内嵌：script标签内
3. 外部引入

五、属性

1. 必选：
   type=“text/javascript”
2. 可选：
   1）charset:编码类型
   2）src:包含可执行的外部引入文件地址
   3）async:规定异步执行脚本 （仅使用于外部脚本）
   4）defer：控件，加载后延迟到文档完全被解析和显示之后再执行

六、检查js语句

. f12 控制台 console

1. console.log()函数；
   
   只有当此行之前执行的语句无误后才执行
2. alert():web窗口弹出消息
   alert(‘sds’);
   alert(11);
3. debugger语句调用任何可用的调试功能
   f12 sources里查看

七、注释

1. //单行
2. /* */多行注释

八、变量

1. var 定义申明一个可存储数据的容器
2. 关键字：拥有特殊意义的单词
3. 变量又称为标识符

九、命名规则

只能是字母、数字、下划线、美元符号$

1. 第一个字符只能是字母、下划线、美元符号
2. 关键字和保留字不能作为变量命名 （保留字将会成为关键字的单词）
3. 驼峰式只能用下划线，不能用-号
   注意：在HTML里不区分字母大小写，而js里区分字母大小写
   代码执行顺序:从上往下，从左往右

十、运算符（详细见web前端开发——数据类型的检测）

算术运算符：+、-、*、/、%
赋值运算符：把右边赋予给左边 "="、“+=”、“-="

设置值：给变量重新赋值
在JS中，标签又称为元素
注意：最后将JS放于所有语句之后或给script标签增加defer属性避免js代码执行时找不到对应id值而产生null

十一、操作标签步骤 id名唯一

1. 获取元素，通过id获取元素

   . : 什么什么的

2. 通过js来操作样式：只能操作行间样式

3. box.style.background:设置该标签的背景样式
   

4. 不加等于：获取值
   console.log(box,box.style.width);获取行间样式的样式
   console.log(box.id,box.className);获取行间样式的id,和class值

十二、事件:指文档或者浏览器窗口中发生的一些特定的交互瞬间。

只能给标签加事件

固定搭配
标签变量.事件=function(){}

注意： a标签设置onclick会跳转，给href加“ javascript:；”,就可以避免刷新页面

事件1：onclik

标签名.onclik=function(){}

事件2：window.onload
在整个HTML页面资源加载完触发事件
常用来包裹所有的js代码，可使js不管在代码的什么位置都可以获取到元素

window.onload=function(){}