正则表达式-邮箱提取
摘要：
邮箱提取 - 题目描述 将字符串'小明：大神么么哒，正好是我想要的，我的邮箱是xiaoming@qq.com小红：我老公最爱看这个了，我想给他一个惊喜，么么么哒，邮箱是xiaohong@sina.com我：好人一生平安，邮箱是wuyou@163.com'中所有的邮箱号码提取出来 - 训练目标 正则表 阅读全文
posted @ 2021-04-27 20:09 前端码牛 阅读(872) 评论(0) 推荐(0)
箭头函数面试题
摘要：
1 <script type="text/javascript"> 2 3 var age = 100; 4 5 var obj = { 6 age: 20, 7 say: () => { 8 alert(this.age) 9 } 10 } 11 12 obj.say(); 13 </script 阅读全文
posted @ 2021-04-27 19:54 前端码牛 阅读(250) 评论(0) 推荐(0)
理解闭包-看代码说结果
摘要：
1 console.log('start'); 2 setTimeout(function () { 3 console.log('你猜我输出在哪'); 4 }, 0); 5 console.log('end'); 6 for (var i = 0; i < 10; i++) { 7 console 阅读全文
posted @ 2021-04-27 19:45 前端码牛 阅读(67) 评论(0) 推荐(0)
理解闭包-点赞案例
摘要：
理解闭包-点赞案例 题目描述 使用闭包实现点击每个按钮,按钮中的数字都是单独递增的,互不影响 - 训练目标 能够理解闭包 - 训练提示 结构中有四个按钮分别绑定点击事件 点击事件触发一个函数 是修改按钮中文字大数值 使用闭包实现数字的递增 阅读全文
posted @ 2021-04-27 19:43 前端码牛 阅读(83) 评论(0) 推荐(0)
闭包的使用-生成多个相同的随机数
摘要：
生成多个相同的随机数 - 题目描述 写一个函数 生成一个随机数，每次调用函数都返回第一次生成的随机数 - 训练目标 闭包的使用 - 训练提示 1. 创建一个函数 2. 函数内部随机生成一个随机数 3. 使用闭包延长生成的随机数的作用范围 阅读全文
posted @ 2021-04-27 19:42 前端码牛 阅读(221) 评论(0) 推荐(0)
实时匹配模糊查询商品
摘要：
修改课堂案例查询商品 - 题目描述 当输入框输入文字进行实时匹配(模糊查询) - 训练目标 理解属性的高级方法 - 训练提示 1. 当用户输入一个'小' 字,筛选的结果小米就显示在表格中,不需要点击查询按钮 2. 使用表单事件 3. 重点是检测输入框的值和数据中的值是否存在包含的关系 阅读全文
posted @ 2021-04-27 19:38 前端码牛 阅读(338) 评论(0) 推荐(0)
面向对象版TAB栏
摘要：
面向对象版的tab栏 功能要点： 1.点击添加按钮可以增加一个新标签和内容； 2.点击Tab标签上的删除按钮可以删除对应的标签和内容； 3.点击Tab可以切换Tab栏 4.双击Tab名称和内容可以变成输入框，失去焦点和回车可以改变对应内容。 页面结构： <!DOCTYPE html> <html l 阅读全文
posted @ 2021-04-27 19:29 前端码牛 阅读(171) 评论(0) 推荐(0)
添加表格内容
摘要：
添加表格内容（加强训练） - 题目描述 用户在页面上点击按钮,可以把文本框中的数据在表格的新的一行中显示，具体表现如下图： 1）如果如果输入框内容有一项为空，弹出对话框‘请将数据填入完全 2）页面见素材 - 训练目标 能够创建和添加节点 - 训练提示 1.按钮注册单击事件 2.获取并判断文本框的内容 阅读全文
posted @ 2021-04-27 19:14 前端码牛 阅读(319) 评论(0) 推荐(0)
时钟倒计时
摘要：
页面电子时钟（加强训练） - 题目描述 页面上有一个电子时钟，显示当前的年月日，时分秒，要求自动变化，具体表现如下图： 1）要求双位显示，例如：九点九分九秒，显示为09:09:09 - 训练目标 能够使用定时器。 - 训练提示 1.开启定时器，每隔1秒执行1次回调函数 2.回调函数中，使用Date对 阅读全文
posted @ 2021-04-27 19:09 前端码牛 阅读(439) 评论(0) 推荐(0)
筋斗云导航栏
摘要：
筋斗云导航栏 筋头云案例 - 题目描述 把课上的筋头云案例写一遍 - 训练目标 能够会使用动画函数书写返回筋头云案例 - 训练提示 1. 利用动画函数做动画效果 2. 原先筋斗云的起始位置是0 3. 鼠标经过某个小li，把当前小li的offsetLeft 位置做为目标值即可 4. 鼠标离开某个小li 阅读全文
posted @ 2021-04-27 18:50 前端码牛 阅读(88) 评论(0) 推荐(0)
本地存储
摘要：
本地存储：Cookie、localStorage、sessionStorage 项目 Cookie localStorage sessionStorage 容量 <4KB （URL的大小决定了Cookie不会太大） <20MB <5MB 传递方式 数据始终在同源的http请求中携带（即使不需要），即 阅读全文
posted @ 2021-04-27 18:49 前端码牛 阅读(158) 评论(0) 推荐(0)
轮播图
摘要：
轮播图 1、网页轮播图 - 题目描述 把课上的网页轮播图写一遍 - 训练目标 能够独立完成网页轮播图案例,会使用动画函数 - 训练提示 1.鼠标经过轮播图模块，左右按钮显示，离开隐藏左右按钮。 2.点击右侧按钮一次，图片往左播放一张，以此类推，左侧按钮同理。 3.图片播放的同时，下面小圆 阅读全文
posted @ 2021-04-27 18:48 前端码牛 阅读(478) 评论(0) 推荐(0)
移动端拖动元素
摘要：
移动端拖动元素 移动端拖动元素 - 题目描述 把课上的移动端拖动元素案例写一遍 - 训练目标 能够会使用touch事件书写移动端拖动元素案例 - 训练提示 1. touchstart、touchmove、touchend可以实现拖动元素 2. 但是拖动元素需要当前手指的坐标值 我们可以使用 targ 阅读全文
posted @ 2021-04-27 18:44 前端码牛 阅读(105) 评论(0) 推荐(0)
动画函数封装
摘要：
封装简单动画函数 - 题目描述 把课上的封装动画函数写一遍 - 训练目标 能够理解动画函数的封装步骤 - 训练提示 1. 获得盒子当前位置 2. 让盒子在当前位置加上1个移动距离 3. 利用定时器不断重复这个操作 4. 加一个结束定时器的条件 5. 注意此元素需要添加定位，才能使用element.s 阅读全文
posted @ 2021-04-27 18:41 前端码牛 阅读(57) 评论(0) 推荐(0)
拖动的模态框
摘要：
模态框拖拽 - 题目描述 把今天课上讲的模态框拖拽写一遍 - 训练目标 能够独自完成模态框拖拽的制作 - 训练提示 1.点击弹出层，会弹出模态框， 并且显示灰色半透明的遮挡层。 2.点击关闭按钮，可以关闭模态框，并且同时关闭灰色半透明遮挡层。 3.鼠标放到模态框最上面一行，可以按住鼠标拖拽模态框在页 阅读全文
posted @ 2021-04-27 18:39 前端码牛 阅读(100) 评论(0) 推荐(0)
侧边栏
摘要：
仿淘宝固定右侧侧边栏 - 题目描述 把课上的仿淘宝固定右侧侧边栏写一遍 - 训练目标 能够独立完成仿淘宝固定右侧侧边栏案例 - 训练提示 1. 原先侧边栏是绝对定位 2. 当页面滚动到一定位置，侧边栏改为固定定位 3. 页面继续滚动，会让 返回顶部显示出来 1、返回顶部 - 题目描述 把课上的返回顶 阅读全文
posted @ 2021-04-27 17:54 前端码牛 阅读(586) 评论(0) 推荐(0)
仿京东产品图片放大镜
摘要：
仿京东产品图片放大镜 - 题目描述 把课上的返回仿京东放大镜写一遍 - 训练目标 能够独立完成仿京东放大镜案例 - 训练提示 1. 整个案例可以分为三个功能模块 2. 鼠标经过小图片盒子， 黄色的遮挡层 和 大图片盒子显示，离开隐藏2个盒子功能 3. 黄色的遮挡层跟随鼠标功能。 4. 移动黄色遮挡层 阅读全文
posted @ 2021-04-27 17:50 前端码牛 阅读(79) 评论(0) 推荐(0)
浙公网安备 33010602011771号