一、JS介绍
可以在前端页面上进行逻辑处理,来解决表单的验证等问题,提升效率,直接在前端提示问题,减少服务器压力

应用1:可以做静态验证和动态验证(进行异步请求)

应用2:可以解析后端传过来的响应
应用3:可以制作页面的行为,比如定时轮播、时钟、加载数据...
二、语法
1.语法组成

2.编写位置
可以在head和Body中写<script>
3.注释

4.输出
输出到控制台
5.外部文件引入
![]()
6.变量声明与赋值


7.数据类型

(1)number

(2)boolean
(3)undefined
声明变量,但没赋值
(4)string
通过json文件进行前后端的传递,用单引号/双引号都可以表示
(5)null
(6)强制类型转换
转化为number

转化为boolean

转化为string

parseInt和parseFloat分别转为整数和小数,比如下面的指令都可以在控制台输出123.45

8.运算符

(1)算数运算符
除数运算时,整数/整数可以得到小数
(2)自增自减运算符

(3)赋值运算符
(4)比较运算符
===值和类型都相等
(5)逻辑运算符

(6)三元运算符

(7)字符串连接运算符
9.流程控制语句
do...while是无条件先执行一次

10.隐式转换

11.函数定义和复用

函数表达式

12.arguments对象
封装的是实参的数据,可以获取所有的实参数据,哪怕实参超过形参的数量





13.变量作用范围
只有在函数中声明的变量是局部变量,在外部不能访问,js没有作用域、代码块的概念,因此即使在if语句中声明的变量,在外面也能访问。
14.JS内置对象
(1)字符串对象

(2)数组对象
创建

length获取信息并且可以改变信息

访问数组元素

对数组元素进行操作

(3)math对象

(4)date对象
创建:月份从0开始定义

方法:

(5)正则对象
创建有两种方式:

定义了字符串的组成规则


(6)框对象
警告框
![]()
询问框

确认框

(7)定时器对象
循环定时:比如广告定时弹出一次
一定定时:比如在打开一个页面多久后,广告只弹出一次

15.自定义对象
通过new关键字创建对象

通过字面量创建对象

通过构造函数创建对象

三、DOM操作
可以动态的改变文档结构

1.Document对象
可以用来获取元素
script要放在内容之后

![]()

2.Element对象
获取元素的属性,从而进行增删改查操作 (需要先通过上一步获取元素)

3.标签体内容操作

4.元素关系操作
获取父元素和子元素

5.插入节点
创建新的节点,插入到已有的节点中

还可以插入到已有节点的前面

6.删除节点
通过父删除子,有两种方式:

7.表单操作
通过DOM可以便捷地操作表单


四、事件

1.单击事件

2.焦点事件

3.改变事件

4.鼠标移入移出事件
下例动态地改变class的属性值

5.页面加载事件
定义在页面内容之前,可正常加载

6.表单事件

五、BOM操作
1.window对象

2.location对象
跳转到其他页面,还可以加定时器

3.history对象


六、ES6新增特性
1.let关键字

2.const关键字
定义的变量值不允许修改,定义的数组不允许修改整个数组/对象的引用,但可以修改数组元素/对象内容

七、原型

