目录
一.JS表单验证基本介绍
1.1.JS表单验证概述
1.2表单验证的作用
1.3JS表单验证需求分析
二.JavaScript 事件列表
三.表单验证方式
3.1 string常见方法
3.2 案例
例：submit事件
例：焦点事件
四.表单验证方式二
4.1正则表达式概述
4.2 定义方式
4.3 正则规则符号介绍
4.4案例
五.案例
例：漂浮广告
例：放大镜
一.JS表单验证基本介绍
1.1.JS表单验证概述
表单验证是JavaScript中高级选项之一。JavaScript可用来在大数据被送往服务器前对HTML表单中的这些输入数据进行验证。
1.2表单验证的作用
减轻服务器的压力
如果没有表单验证那么用户输入的账号密码就要先发送到服务器验证，这样的话如果同时有多个设备同时发送请求那么就会很影响性能
保证输入的数据符合要求
如果我们在用户输入的时候就开始验证，要是符合规则的话我们就可以直接发送到服务器这样服务器就不需要验证了直接可以接受了
1.3JS表单验证需求分析
表单验证需求 1、用户名不能为空 2、用户名必须在6-14位 3、用户名和密码由数字和字母组成（正则表达式） 4、密码和确认密码一致，邮箱地址合法 5、统一失去焦点验证 6、错误信息统一在span标签中显示，要求字体12号，红色，验证成功显示绿色字体 7、文本框获得焦点，清除错误信息，如果文本框中数据不合法，要求清空文本框的value 8、最终表单所有项均合法方可提交
二.JavaScript 事件列表
在网页中不同的元素在操作过程中会激活一些不同操作。如：鼠标单击，按下键盘，失去焦点等。我们可以针对这些操作进行代码的编写。
//方式一：命名函数
//方式二：匿名函数
元素对象.onclick = function () {
事件处理的代码
}
事件名 作用 onclick 单击事件 ondblclick 双击事件 onload 加载完毕 onfocus 得到焦点 onblur 失去焦点 onchange 改变事件 onmouseover 鼠标上移 onmouseout 鼠标移除 onsubmit 表单提交事件
三.表单验证方式
3.1 string常见方法
indexOf(), lastIndexOf() 查找字符位置 charAt() 按索引返回字符串 concat() 拼接字符串 substr() 按长度截取字符串 slice() 截取字符串 substring() 截取字符串 replace() 替换字符串 toUpperCase(), toLowerCase() 大小写转换
3.2 案例
例：submit事件
例：焦点事件
四.表单验证方式二
4.1正则表达式概述
正则表达式使用单个字符串来描述，匹配一系列符合某个句法规则的字符串搜索模式用某种模式去匹配一类字符串的公式
4.2 定义方式
//字面量方式，其由包含在斜杠之间的模式组成，如下所示：
var re = /ab+c/;
//构造函数方式，调用RegExp对象的构造函数，如下所示：
var re = new RegExp("ab+c");
var regex = /正则规则/;
//调用方法判断是否满足要求
var flag = regex.test('内容');
4.3 正则规则符号介绍
4.4案例