JavaScript-交互效果
返回顶部
效果：
多复制几行，需要滚动条！！！
多复制几行，需要滚动条！！！
多复制几行，需要滚动条！！！
多复制几行，需要滚动条！！！
多复制几行，需要滚动条！！！
多复制几行，需要滚动条！！！
多复制几行，需要滚动条！！！
多复制几行，需要滚动条！！！
多复制几行，需要滚动条！！！
多复制几行，需要滚动条！！！
多复制几行，需要滚动条！！！
多复制几行，需要滚动条！！！
多复制几行，需要滚动条！！！
多复制几行，需要滚动条！！！
多复制几行，需要滚动条！！！
多复制几行，需要滚动条！！！
多复制几行，需要滚动条！！！
多复制几行，需要滚动条！！！
多复制几行，需要滚动条！！！
多复制几行，需要滚动条！！！
多复制几行，需要滚动条！！！
多复制几行，需要滚动条！！！
X关闭
正则表达式
概念
正则表达式：是一种字符串中查找、替换、拆分、数据匹配的模式。
正则表达式的定义
1.字面量方式（常用）：
var reg=/正则表达式规则/修饰符;2.实例化方式:
var reg=new RegExp("正则表达式","修饰符");
3.修饰符：
i 不区分大小写
m 多行匹配，如果在一行找不到就继续找下一行直到结束
g 全局匹配，找到一个继续找下一个
4.正则表达式的使用
1）正则表达式对象方法：
正则表达式.test(字符串) //测试字符串中是否能找到正则表达式匹配结果，返回真或假
正则表达式.exec(字符串) // 匹配出字符串和正则表达式的子字符串
2）字符串对象方法：
字符串.match(正则表达式) //匹配字符串
字符串.replace(正则表达式,""**) // 替换匹配到的字符
字符串.split(正则表达式) //将正则表达式匹配到的字符作为拆分间隔符
案例：
正则表达式的编写
正则表达式的编写：三段式：字符+数量+匹配模式
1.匹配字符
[0-9] 匹配到括号中出现的所有字符(0123456789)
[a-z] 小写字母
[A-Z] 大写字母
[A-z] 不区分大小写
\d 匹配数字，相当于[0-9]
\D 匹配非数字，除数字以外的所有字符
\w 匹配单词字符，相当于[0-9A-z]
\W 匹配非单词字符
\t 匹配table键（缩进符）
\r 匹配回车符
\n 匹配换行符
. 匹配除换行以外的所有字符
^ 字符串开始
$ 字符串结束
2.数量
* 前面匹配的字符出现0次或多次
+ 前面匹配的字符出现1次或多次
{n} 字符出现n次
{n,m} n<=数量<=m
{n,} n次以上
3.匹配模式
贪婪模式：默认
饥饿模式：尽可能匹配少的
案例：
注册表单验证
效果：
代码：
Tab滑动菜单效果
效果：
代码：
图片轮播动画的制作BannerFocus
效果图:
代码1（简单）:
代码1（难）:
作业
1. 完成上课演示的三个交互效果
2. 制作一个二级下拉菜单（移到顶级菜单时显示子菜单）
3. 制作一个企业网站，练习HTML和CSS，要做界面交互效果 基础版：只做回到顶部交互 挑战版：完成所有交互效果，如：轮播图、选项卡、回到顶部等