# JavaScript案例合集 **Repository Path**: wangxios/workspace_javascript ## Basic Information - **Project Name**: JavaScript案例合集 - **Description**: HTML + javascript页面效果案例 - **Primary Language**: HTML - **License**: Apache-2.0 - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 1 - **Forks**: 0 - **Created**: 2021-09-21 - **Last Updated**: 2026-03-09 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README ## javascript特效 - CSS样式 1. [表格布局](./css/1.html) 2. [display](./css/2.html) 3. [position](./css/3.html) 4. [定位背景图像](./css/4.html) - 页面事件 1. [页面反向显示](./page/1.html) 2. [自动页面最大化](./page/2.html) 3. [页面自动刷新](./page/3.html) 4. [页面的前进后退](./page/4.html) 5. [屏蔽源代码](./page/5.html) 6. [保护自己的网页不被放入框架](./page/6.html) 7. [打印页面出现的错误](./page/7.html) 8. [调用其它网页](./page/8.html) 9. [倒计时载入页面](./page/9.html) 10. [定义网页关键字](./page/10.html) 11. [进入页面同时弹出欢迎对话框](./page/11.html) 12. [禁止网页另存为](./page/12.html) 13. [禁止页面加入缓存](./page/13.html) 14. [离开页面时弹出对话框](./page/14.html) 15. [判断页面是否添加了W3C声明](./page/15.html) 16. [屏蔽网页上的脚本](./page/16.html) 17. [以窗口模式打开网页](./page/17.html) 18. [自动识别网页类型](./page/18.html) 19. [在网页中动态添加Script脚本](./page/19.html) 20. [随机修改页面内容](./page/20.html) - 按钮事件 1. [页面刷新按钮](./button/1.html) 2. [回车调用登录按钮](./button/2.html) 3. [动态创建按钮](./button/3.html) 4. [平面按钮](./button/4.html) 5. [按钮的嵌入效果](./button/5.html) - javascript基础 1. [javascript递归深拷贝](./javascript/1.html) 2. [闭包](./javascript/2.html) 3. [Promise](./javascript/3.html) 4. [Promise](./javascript/4.html) 5. [登录实例session](./login/) 6. [jwt](./jwt/) 7. [this指向](./javascript/5.html) 8. [防抖](./javascript/6.html) 9. [节流](./javascript/7.html) 10. [原型继承](./javascript/8.html) 11. [数组常用方法详解](./javascript/9.html) 12. [字符串常用方法](./javascript/10.html) - javascript 实例 1. [幻灯片](./example/slideshow/index.html) 2. [LightBox](./example/LightBox/index.html) 3. [搜索框自动提示](./example/SearchAutoTip//index.html) 4. [动画效果](./example/Move/index.html) 5. [进度条](./example/Progress/index.html) 6. [百分比进度条](./example/Progress/index-2.html) 7. [弹框提示](./example/Popuptext/index.html) 8. [计算器](./example/Calc/index.html) 9. [手风琴动画](./example/Accordion/index.html) 10. [选项卡](./example/Tab/index.html) 11. [垂直方向选项卡](./example/Tab/index-2.html) 12. [联想自动补齐](./example/AutoComplete/index.html) - 表单处理 1. [表单验证 - 必填字段验证](./form/1.html) 2. [表单验证 - 邮箱格式验证](./form/2.html) 3. [表单验证 - 手机号验证](./form/3.html) 4. [表单验证 - 身份证号验证](./form/4.html) 5. [表单验证 - 密码强度检测](./form/5.html) 6. [表单验证 - 确认密码匹配](./form/6.html) 7. [表单验证 - URL格式验证](./form/7.html) 8. [表单验证 - 日期格式验证](./form/8.html) 9. [表单验证 - 数字范围验证](./form/9.html) 10. [表单验证 - 文件类型验证](./form/10.html) 11. [表单验证 - 文件大小验证](./form/11.html) 12. [表单验证 - 自定义正则验证](./form/12.html) 13. [表单提交 - AJAX提交](./form/13.html) 14. [表单提交 - Fetch API提交](./form/14.html) 15. [表单提交 - 表单数据序列化](./form/15.html) 16. [表单提交 - 文件上传](./form/16.html) 17. [表单提交 - 多文件上传](./form/17.html) 18. [表单提交 - 拖拽上传](./form/18.html) 19. [表单提交 - 进度条显示](./form/19.html) 20. [表单提交 - 表单验证与提交结合](./form/20.html) 21. [表单提交 - 表单数据验证与错误提示](./form/21.html) 22. [表单提交 - 取消上传](./form/22.html) 23. [表单交互 - 实时字数统计](./form/23.html) 24. [表单交互 - 实时字数限制](./form/24.html) 25. [表单交互 - 自动保存草稿](./form/25.html) 26. [表单交互 - 表单重置](./form/26.html) 27. [表单交互 - 表单清空](./form/27.html) 28. [表单交互 - 表单回填](./form/28.html) 29. [表单交互 - 动态添加字段](./form/29.html) 30. [表单交互 - 动态删除字段](./form/30.html) 31. [表单交互 - 字段依赖显示](./form/31.html) 32. [表单交互 - 字段联动选择](./form/32.html) 33. [表单交互 - 步骤表单](./form/33.html) 34. [表单交互 - 分步验证](./form/34.html) 35. [表单交互 - 表单预览](./form/35.html) 36. [表单交互 - 表单打印](./form/36.html) 37. [表单交互 - 表单导出](./form/37.html) 38. [表单样式 - 浮动标签](./form/38.html) 39. [表单样式 - 输入框聚焦动画](./form/39.html) 40. [表单样式 - 密码显示隐藏](./form/40.html) 41. [表单样式 - 自定义单选框](./form/41.html) 42. [表单样式 - 自定义复选框](./form/42.html) 43. [表单样式 - 自定义下拉框](./form/43.html) 44. [表单样式 - 自定义文件上传](./form/44.html) - DOM操作 1. [DOM查询 - getElementById](./dom/1.html) 2. [DOM查询 - getElementsByClassName](./dom/2.html) 3. [DOM查询 - getElementsByTagName](./dom/3.html) 4. [DOM查询 - querySelector](./dom/4.html) 5. [DOM查询 - querySelectorAll](./dom/5.html) 6. [DOM查询 - 元素遍历](./dom/6.html) 7. [DOM查询 - 父子元素查找](./dom/7.html) 8. [DOM查询 - 兄弟元素查找](./dom/8.html) 9. [DOM创建 - createElement](./dom/9.html) 10. [DOM创建 - createTextNode](./dom/10.html) 11. [DOM创建 - createDocumentFragment](./dom/11.html) 12. [DOM创建 - 克隆节点](./dom/12.html) 13. [DOM修改 - innerHTML](./dom/13.html) 14. [DOM修改 - textContent](./dom/14.html) 15. [DOM修改 - outerHTML](./dom/15.html) 16. [DOM修改 - 属性设置](./dom/16.html) 17. [DOM修改 - 样式设置](./dom/17.html) 18. [DOM修改 - 类名操作](./dom/18.html) 19. [DOM修改 - 数据属性](./dom/19.html) 20. [DOM删除 - removeChild](./dom/20.html) 21. [DOM删除 - remove](./dom/21.html) 22. [DOM删除 - 清空内容](./dom/22.html) 23. [DOM添加 - appendChild](./dom/23.html) 24. [DOM添加 - insertBefore](./dom/24.html) 25. [DOM添加 - insertAdjacentHTML](./dom/25.html) 26. [DOM添加 - insertAdjacentElement](./dom/26.html) 27. [DOM替换 - replaceChild](./dom/27.html) 28. [DOM事件 - 事件绑定](./dom/28.html) 29. [DOM事件 - 事件委托](./dom/29.html) 30. [DOM事件 - 事件冒泡](./dom/30.html) 31. [DOM事件 - 事件捕获](./dom/31.html) 32. [DOM事件 - 事件阻止](./dom/32.html) - 数组操作 1. [数组创建 - 字面量创建](./array/1.html) 2. [数组创建 - Array构造函数](./array/2.html) 3. [数组创建 - Array.of](./array/3.html) 4. [数组创建 - Array.from](./array/4.html) 5. [数组访问 - 索引访问](./array/5.html) 6. [数组访问 - 解构赋值](./array/6.html) 7. [数组修改 - push](./array/7.html) 8. [数组修改 - pop](./array/8.html) 9. [数组修改 - unshift](./array/9.html) 10. [数组修改 - shift](./array/10.html) 11. [数组修改 - splice](./array/11.html) 12. [数组修改 - fill](./array/12.html) 13. [数组遍历 - for循环](./array/13.html) 14. [数组遍历 - forEach](./array/14.html) 15. [数组遍历 - map](./array/15.html) 16. [数组遍历 - filter](./array/16.html) 17. [数组遍历 - reduce](./array/17.html) 18. [数组遍历 - find](./array/18.html) 19. [数组遍历 - findIndex](./array/19.html) 20. [数组遍历 - some](./array/20.html) 21. [数组遍历 - every](./array/21.html) 22. [数组排序 - sort](./array/22.html) 23. [数组排序 - reverse](./array/23.html) 24. [数组查询 - includes](./array/24.html) 25. [数组查询 - indexOf](./array/25.html) 26. [数组查询 - lastIndexOf](./array/26.html) 27. [数组转换 - join](./array/27.html) 28. [数组转换 - toString](./array/28.html) 29. [数组切片 - slice](./array/29.html) 30. [数组合并 - concat](./array/30.html) - 字符串操作 1. [字符串创建 - 字面量](./string/1.html) 2. [字符串创建 - String构造函数](./string/2.html) 3. [字符串访问 - 索引访问](./string/3.html) 4. [字符串访问 - charAt](./string/4.html) 5. [字符串访问 - at方法](./string/5.html) 6. [字符串连接 - +](./string/6.html) 7. [字符串连接 - concat](./string/7.html) 8. [字符串连接 - 模板字符串](./string/8.html) 9. [字符串截取 - substring](./string/9.html) 10. [字符串截取 - substr](./string/10.html) 11. [字符串截取 - slice](./string/11.html) 12. [字符串分割 - split](./string/12.html) 13. [字符串替换 - replace](./string/13.html) 14. [字符串替换 - replaceAll](./string/14.html) 15. [字符串大小写 - toUpperCase](./string/15.html) 16. [字符串大小写 - toLowerCase](./string/16.html) 17. [字符串去除空格 - trim](./string/17.html) 18. [字符串去除空格 - trimStart](./string/18.html) 19. [字符串去除空格 - trimEnd](./string/19.html) 20. [字符串填充 - padStart](./string/20.html) 21. [字符串填充 - padEnd](./string/21.html) 22. [字符串重复 - repeat](./string/22.html) 23. [字符串查找 - indexOf](./string/23.html) 24. [字符串查找 - lastIndexOf](./string/24.html) 25. [字符串查找 - includes](./string/25.html) 26. [字符串查找 - startsWith](./string/26.html) 27. [字符串查找 - endsWith](./string/27.html) 28. [字符串匹配 - search](./string/28.html) 29. [字符串匹配 - match](./string/29.html) 30. [字符串匹配 - matchAll](./string/30.html) - 对象操作 1. [对象创建 - 字面量](./object/1.html) 2. [对象创建 - Object构造函数](./object/2.html) 3. [对象创建 - Object.create](./object/3.html) 4. [对象访问 - 点号访问](./object/4.html) 5. [对象访问 - 方括号访问](./object/5.html) 6. [对象访问 - 可选链](./object/6.html) 7. [对象添加 - 直接赋值](./object/7.html) 8. [对象添加 - Object.assign](./object/8.html) 9. [对象添加 - 展开运算符](./object/9.html) 10. [对象删除 - delete](./object/10.html) 11. [对象遍历 - for...in](./object/11.html) 12. [对象遍历 - Object.keys](./object/12.html) 13. [对象遍历 - Object.values](./object/13.html) 14. [对象遍历 - Object.entries](./object/14.html) 15. [对象检测 - hasOwnProperty](./object/15.html) 16. [对象检测 - in操作符](./object/16.html) 17. [对象合并 - Object.assign](./object/17.html) 18. [对象合并 - 展开运算符](./object/18.html) 19. [对象克隆 - 浅拷贝](./object/19.html) 20. [对象克隆 - 深拷贝](./object/20.html) 21. [对象冻结 - Object.freeze](./object/21.html) 22. [对象密封 - Object.seal](./object/22.html) 23. [对象属性 - get/set](./object/23.html) 24. [对象属性 - 属性描述符](./object/24.html) 25. [对象原型 - prototype](./object/25.html) 26. [对象原型 - __proto__](./object/26.html) 27. [对象原型 - Object.getPrototypeOf](./object/27.html) 28. [对象原型 - Object.setPrototypeOf](./object/28.html) 29. [对象转换 - toString](./object/29.html) 30. [对象转换 - valueOf](./object/30.html) - 函数操作 1. [函数定义 - 函数声明](./function/1.html) 2. [函数定义 - 函数表达式](./function/2.html) 3. [函数定义 - 箭头函数](./function/3.html) 4. [函数定义 - Function构造函数](./function/4.html) 5. [函数调用 - 普通调用](./function/5.html) 6. [函数调用 - call](./function/6.html) 7. [函数调用 - apply](./function/7.html) 8. [函数调用 - bind](./function/8.html) 9. [函数参数 - 默认参数](./function/9.html) 10. [函数参数 - 剩余参数](./function/10.html) 11. [函数参数 - 解构参数](./function/11.html) 12. [函数返回 - return](./function/12.html) 13. [函数返回 - 隐式返回](./function/13.html) 14. [函数作用域 - 全局作用域](./function/14.html) 15. [函数作用域 - 函数作用域](./function/15.html) 16. [函数作用域 - 块级作用域](./function/16.html) 17. [函数闭包 - 基础闭包](./function/17.html) 18. [函数闭包 - 闭包计数器](./function/18.html) 19. [函数闭包 - 闭包缓存](./function/19.html) 20. [函数高阶 - map](./function/20.html) 21. [函数高阶 - filter](./function/21.html) 22. [函数高阶 - reduce](./function/22.html) 23. [函数高阶 - 柯里化](./function/23.html) 24. [函数递归 - 基础递归](./function/24.html) 25. [函数递归 - 尾递归](./function/25.html) 26. [函数递归 - 递归树遍历](./function/26.html) 27. [函数this - 普通函数this](./function/27.html) 28. [函数this - 箭头函数this](./function/28.html) 29. [函数this - call/apply/bind](./function/29.html) 30. [函数this - 构造函数this](./function/30.html) - 异步编程 1. [回调函数 - 基础回调](./async/1.html) 2. [回调函数 - 回调地狱](./async/2.html) 3. [Promise - 基础Promise](./async/3.html) 4. [Promise - Promise链](./async/4.html) 5. [Promise - Promise.all](./async/5.html) 6. [Promise - Promise.race](./async/6.html) 7. [Promise - Promise.allSettled](./async/7.html) 8. [Promise - Promise.any](./async/8.html) 9. [Promise - 错误处理](./async/9.html) 10. [Promise - 自定义Promise](./async/10.html) 11. [async/await - 基础用法](./async/11.html) 12. [async/await - 并发执行](./async/12.html) 13. [async/await - 顺序执行](./async/13.html) 14. [async/await - 错误处理](./async/14.html) 15. [async/await - 重试机制](./async/15.html) 16. [async/await - 超时控制](./async/16.html) 17. [定时器 - setTimeout](./async/17.html) 18. [定时器 - setInterval](./async/18.html) 19. [定时器 - setImmediate 模拟](./async/19.html) 20. [定时器 - requestAnimationFrame](./async/20.html) 21. [定时器 - clearTimeout](./async/21.html) 22. [定时器 - clearInterval](./async/22.html) 23. [定时器 - 防抖实现](./async/23.html) 24. [定时器 - 节流实现](./async/24.html) 25. [事件循环 - 宏任务](./async/25.html) 26. [事件循环 - 微任务](./async/26.html) 27. [事件循环 - 执行顺序](./async/27.html) 28. [Generator - 基础Generator](./async/28.html) 29. [Generator - Generator迭代](./async/29.html) 30. [Generator - Generator异步](./async/30.html) 31. [Generator - Generator委托](./async/31.html) 32. [Generator - Generator并发](./async/32.html) 33. [Generator - Generator错误处理](./async/33.html) 34. [Generator - Generator应用](./async/34.html) 35. [Generator - Generator性能](./async/35.html) 36. [Web Worker - Web Worker基础](./async/36.html) 37. [Web Worker - Worker通信](./async/37.html) 38. [Web Worker - Worker计算](./async/38.html) 39. [Web Worker - Worker文件](./async/39.html) 40. [Web Worker - Worker池](./async/40.html) - 数据存储 1. [localStorage - 基础存储](./storage/1.html) 2. [localStorage - 读取数据](./storage/2.html) 3. [localStorage - 删除数据](./storage/3.html) 4. [localStorage - 清空数据](./storage/4.html) 5. [localStorage - 存储对象](./storage/5.html) 6. [localStorage - 存储数组](./storage/6.html) 7. [localStorage - 过期时间](./storage/7.html) 8. [sessionStorage - 基础存储](./storage/8.html) 9. [sessionStorage - 读取数据](./storage/9.html) 10. [sessionStorage - 删除数据](./storage/10.html) 11. [sessionStorage - 清空数据](./storage/11.html) 12. [Cookie - 设置Cookie](./storage/12.html) 13. [Cookie - 读取Cookie](./storage/13.html) 14. [Cookie - 删除Cookie](./storage/14.html) 15. [Cookie - Cookie过期](./storage/15.html) 16. [Cookie - Cookie路径](./storage/16.html) 17. [Cookie - Cookie域名](./storage/17.html) 18. [IndexedDB - 打开数据库](./storage/18.html) 19. [IndexedDB - 添加数据](./storage/19.html) 20. [IndexedDB - 查询数据](./storage/20.html) - 网络请求 1. [XMLHttpRequest - 基础请求](./network/1.html) 2. [XMLHttpRequest - GET请求](./network/2.html) 3. [XMLHttpRequest - POST请求](./network/3.html) 4. [XMLHttpRequest - 上传文件](./network/4.html) 5. [XMLHttpRequest - 请求进度](./network/5.html) 6. [XMLHttpRequest - 请求超时](./network/6.html) 7. [XMLHttpRequest - 请求取消](./network/7.html) 8. [Fetch API - 基础请求](./network/8.html) 9. [Fetch API - GET请求](./network/9.html) 10. [Fetch API - POST请求](./network/10.html) 11. [Fetch API - JSON请求](./network/11.html) 12. [Fetch API - 表单请求](./network/12.html) 13. [Fetch API - 文件上传](./network/13.html) 14. [Fetch API - 请求头设置](./network/14.html) 15. [Fetch API - 响应处理](./network/15.html) 16. [Fetch API - 错误处理](./network/16.html) 17. [Fetch API - 超时控制](./network/17.html) 18. [Fetch API - 请求取消](./network/18.html) 19. [Axios - 基础请求](./network/19.html) 20. [Axios - 拦截器](./network/20.html) 21. [Axios - 并发请求](./network/21.html) 22. [Axios - 请求取消](./network/22.html) 23. [JSONP - 基础JSONP](./network/23.html) 24. [JSONP - 动态创建](./network/24.html) 25. [WebSocket - 建立连接](./network/25.html) 26. [WebSocket - 发送消息](./network/26.html) 27. [WebSocket - 接收消息](./network/27.html) 28. [WebSocket - 关闭连接](./network/28.html) 29. [WebSocket - 错误处理](./network/29.html) 30. [WebSocket - 心跳检测](./network/30.html) - 动画效果 1. [CSS动画 - transition](./animation/1.html) 2. [CSS动画 - animation](./animation/2.html) 3. [CSS动画 - keyframes](./animation/3.html) 4. [CSS动画 - 贝塞尔曲线](./animation/4.html) 5. [JS动画 - requestAnimationFrame](./animation/5.html) 6. [JS动画 - 匀速运动](./animation/6.html) 7. [JS动画 - 加速运动](./animation/7.html) 8. [JS动画 - 减速运动](./animation/8.html) 9. [JS动画 - 弹性运动](./animation/9.html) 10. [JS动画 - 缓动函数](./animation/10.html) 11. [动画库 - GSAP基础](./animation/11.html) 12. [动画库 - GSAP时间轴](./animation/12.html) 13. [动画库 - GSAP插件](./animation/13.html) 14. [Canvas动画 - 基础绘制](./animation/14.html) 15. [Canvas动画 - 动画循环](./animation/15.html) 16. [Canvas动画 - 粒子效果](./animation/16.html) 17. [Canvas动画 - 碰撞检测](./animation/17.html) 18. [SVG动画 - SMIL动画](./animation/18.html) 19. [SVG动画 - CSS动画](./animation/19.html) 20. [SVG动画 - JS动画](./animation/20.html) 21. [滚动动画 - 滚动显示](./animation/21.html) 22. [滚动动画 - 视差滚动](./animation/22.html) 23. [滚动动画 - 滚动触发](./animation/23.html) 24. [交互动画 - 悬停效果](./animation/24.html) 25. [交互动画 - 点击效果](./animation/25.html) 26. [交互动画 - 拖拽效果](./animation/26.html) 27. [交互动画 - 缩放效果](./animation/27.html) 28. [交互动画 - 旋转效果](./animation/28.html) 29. [页面过渡 - 淡入淡出](./animation/29.html) 30. [页面过渡 - 滑动切换](./animation/30.html) - 图表可视化 1. [Canvas图表 - 折线图](./chart/1.html) 2. [Canvas图表 - 柱状图](./chart/2.html) 3. [Canvas图表 - 饼图](./chart/3.html) 4. [Canvas图表 - 散点图](./chart/4.html) 5. [Canvas图表 - 雷达图](./chart/5.html) 6. [ECharts - 基础配置](./chart/6.html) 7. [ECharts - 动态数据](./chart/7.html) 8. [ECharts - 交互事件](./chart/8.html) 9. [ECharts - 组合图表](./chart/9.html) 10. [D3.js - 基础选择器](./chart/10.html) 11. [D3.js - 数据绑定](./chart/11.html) 12. [D3.js - 比例尺](./chart/12.html) 13. [D3.js - 坐标轴](./chart/13.html) 14. [D3.js - 力导向图](./chart/14.html) 15. [Chart.js - 基础图表](./chart/15.html) 16. [Chart.js - 混合图表](./chart/16.html) 17. [Chart.js - 动态更新](./chart/17.html) 18. [Chart.js - 响应式图表](./chart/18.html) 19. [Three.js - 基础场景](./chart/19.html) 20. [Three.js - 3D图表](./chart/20.html) - 工具函数 1. [类型检测 - typeof](./utils/1.html) 2. [类型检测 - instanceof](./utils/2.html) 3. [类型检测 - constructor](./utils/3.html) 4. [类型检测 - Object.prototype.toString](./utils/4.html) 5. [类型检测 - 自定义类型检测](./utils/5.html) 6. [数组工具 - 数组去重](./utils/6.html) 7. [数组工具 - 数组排序](./utils/7.html) 8. [数组工具 - 数组分组](./utils/8.html) 9. [数组工具 - 数组求和](./utils/9.html) 10. [数组工具 - 数组平均值](./utils/10.html) 11. [数组工具 - 数组最大值](./utils/11.html) 12. [数组工具 - 数组最小值](./utils/12.html) 13. [数组工具 - 数组乱序](./utils/13.html) 14. [数组工具 - 数组交集](./utils/14.html) 15. [数组工具 - 数组并集](./utils/15.html) 16. [数组工具 - 数组差集](./utils/16.html) 17. [字符串工具 - 字符串反转](./utils/17.html) 18. [字符串工具 - 驼峰命名转换](./utils/18.html) 19. [字符串工具 - 字符串截取](./utils/19.html) 20. [字符串工具 - 首字母大写](./utils/20.html) 21. [字符串工具 - 字符串模板](./utils/21.html) 22. [字符串工具 - 字符串截断](./utils/22.html) 23. [数字工具 - 数字格式化](./utils/23.html) 24. [数字工具 - 数字千分位](./utils/24.html) 25. [数字工具 - 数字保留小数](./utils/25.html) 26. [数字工具 - 数字补零](./utils/26.html) 27. [日期工具 - 日期格式化](./utils/27.html) 28. [日期工具 - 日期计算](./utils/28.html) 29. [日期工具 - 时间戳转换](./utils/29.html) 30. [日期工具 - 倒计时](./utils/30.html) - 正则表达式 1. [基础正则 - 字符匹配](./regex/1.html) 2. [基础正则 - 字符类](./regex/2.html) 3. [基础正则 - 量词](./regex/3.html) 4. [基础正则 - 边界](./regex/4.html) 5. [基础正则 - 分组](./regex/5.html) 6. [正则方法 - test](./regex/6.html) 7. [正则方法 - exec](./regex/7.html) 8. [正则方法 - match](./regex/8.html) 9. [正则方法 - replace](./regex/9.html) 10. [正则方法 - search](./regex/10.html) 11. [正则方法 - split](./regex/11.html) 12. [实用正则 - 邮箱验证](./regex/12.html) 13. [实用正则 - 手机号验证](./regex/13.html) 14. [实用正则 - 身份证验证](./regex/14.html) 15. [实用正则 - URL验证](./regex/15.html) 16. [实用正则 - IP地址验证](./regex/16.html) 17. [实用正则 - 日期验证](./regex/17.html) 18. [实用正则 - 密码强度](./regex/18.html) 19. [实用正则 - 中文验证](./regex/19.html) 20. [实用正则 - HTML标签](./regex/20.html) - 浏览器API 1. [History API - pushState](./browser/1.html) 2. [History API - replaceState](./browser/2.html) 3. [History API - go](./browser/3.html) 4. [History API - back](./browser/4.html) 5. [History API - forward](./browser/5.html) 6. [Location API - href](./browser/6.html) 7. [Location API - protocol](./browser/7.html) 8. [Location API - hostname](./browser/8.html) 9. [Location API - pathname](./browser/9.html) 10. [Location API - search](./browser/10.html) 11. [Location API - hash](./browser/11.html) 12. [Navigator API - userAgent](./browser/12.html) 13. [Navigator API - platform](./browser/13.html) 14. [Navigator API - language](./browser/14.html) 15. [Navigator API - online](./browser/15.html) 16. [Screen API - width/height](./browser/16.html) 17. [Screen API - availWidth/availHeight](./browser/17.html) 18. [Screen API - colorDepth](./browser/18.html) 19. [Screen API - orientation](./browser/19.html) 20. [Clipboard API - 复制文本](./browser/20.html) 21. [Clipboard API - 粘贴文本](./browser/21.html) 22. [Clipboard API - 复制图片](./browser/22.html) 23. [Geolocation API - 获取位置](./browser/23.html) 24. [Geolocation API - 监听位置](./browser/24.html) 25. [Geolocation API - 计算距离](./browser/25.html) 26. [Notification API - 显示通知](./browser/26.html) 27. [Notification API - 权限管理](./browser/27.html) 28. [Notification API - 通知事件](./browser/28.html) 29. [Fullscreen API - 全屏显示](./browser/29.html) 30. [Fullscreen API - 退出全屏](./browser/30.html) - 移动端适配 1. [触摸事件 - touchstart](./mobile/1.html) 2. [触摸事件 - touchmove](./mobile/2.html) 3. [触摸事件 - touchend](./mobile/3.html) 4. [触摸事件 - touchcancel](./mobile/4.html) 5. [手势操作 - 点击](./mobile/5.html) 6. [手势操作 - 双击](./mobile/6.html) 7. [手势操作 - 长按](./mobile/7.html) 8. [手势操作 - 滑动](./mobile/8.html) 9. [手势操作 - 拖拽](./mobile/9.html) 10. [手势操作 - 缩放](./mobile/10.html) 11. [手势操作 - 旋转](./mobile/11.html) 12. [设备方向 - deviceorientation](./mobile/12.html) 13. [设备方向 - devicemotion](./mobile/13.html) 14. [响应式设计 - 媒体查询](./mobile/14.html) 15. [响应式设计 - 视口设置](./mobile/15.html) 16. [响应式设计 - rem适配](./mobile/16.html) 17. [响应式设计 - vw/vh适配](./mobile/17.html) 18. [移动端优化 - 点击延迟](./mobile/18.html) 19. [移动端优化 - 滚动优化](./mobile/19.html) 20. [移动端优化 - 性能优化](./mobile/20.html) - 性能优化 1. [代码优化 - 减少DOM操作](./performance/1.html) 2. [代码优化 - 事件委托](./performance/2.html) 3. [代码优化 - 避免内存泄漏](./performance/3.html) 4. [代码优化 - 懒加载](./performance/4.html) 5. [代码优化 - 防抖节流](./performance/5.html) 6. [代码优化 - 虚拟滚动](./performance/6.html) 7. [代码优化 - 代码分割](./performance/7.html) 8. [代码优化 - Tree Shaking](./performance/8.html) 9. [资源优化 - 图片压缩](./performance/9.html) 10. [资源优化 - 图片懒加载](./performance/10.html) 11. [资源优化 - CDN加速](./performance/11.html) 12. [缓存优化 - HTTP缓存](./performance/12.html) 13. [渲染优化 - 重排重绘](./performance/13.html) 14. [渲染优化 - CSS动画](./performance/14.html) 15. [渲染优化 - GPU加速](./performance/15.html) 16. [缓存优化 - localStorage](./performance/16.html) 17. [缓存优化 - Service Worker](./performance/17.html) 18. [资源优化 - 资源预加载](./performance/18.html) 19. [监控优化 - 性能监控](./performance/19.html) 20. [监控优化 - 错误监控](./performance/20.html)