徐sir啊-优快云博客

原创初识Vue之案例二（计算属性与过滤器的使用）

一效果：二代码 1.过滤器： 1.过滤器：（通过在渲染数据中写了|和方法名为fmtPrice） vue中过滤器方法：（此为全局变量的过滤器）我的目的是让价格保留两位小数前面有人民币符号（过滤器的目的是在渲染过程中提前帮你过滤掉你不需要的数据）。 2.计算属性（计算属性是为了方便写法而出现的属性减少div中的代码量）：我的目的是为了让在data()中的firname和lastname合并成如下：（通过在vue中computed中写方法名为fullname()）

2020-07-08 15:28:39 394

原创初识Vue之案例一

一效果：二代码

2020-07-08 14:45:57 239

原创滚动条下拉盒子吸附在顶部

1.效果图： 2.布局：（HTML+CSS） 3.js部分：

2020-06-27 10:04:10 504 1

原创滚动条与进度条联动

1.效果图： 2.布局：（HTML+CSS） js部分：

2020-06-27 09:53:20 623 1

原创利用vue让鼠标经过与点击星星高亮

1.效果图：布局：（HTML+CSS）引入星星样式：

2020-06-27 09:06:41 740

原创 vue轮播图

效果图： 2.布局：（HTML+CSS） 3.vue部分：

2020-06-27 08:56:43 300

原创利用jq完成表单验证

密码安全强度： 1.效果： 2.代码如下：

2020-06-10 11:31:04 283

原创常用的正则表达式

正则： // let reg =/^张/i // let str = '张飞' // console.log(reg.test(str)); // let reg=new RegExp('(美国|日本)','i') // let reg=/^(美国|日本|fuck)/i // let str ='FUCK 你好' // console.log(reg.test(str)); // let reg = /8$/i // l

2020-06-06 10:55:10 200

原创 DOM操作四

鼠标事件的区别: 1.首先在盒子demo中添加一个button： 2.给demo做两组不同的鼠标事件：第一个鼠标事件当经过（离开）红色区域会触发：而当鼠标经过（离开）蓝色区域只会显示移入离开不会显示第二种鼠标事件当经过（离开）蓝色区域会触发：鼠标离开蓝色区域会打印离开所以两者的区别在于有无子集：（onmouseleave：当离开蓝色区域是不会触发;onmouseout：离开蓝色区域会触发）鼠标点击效果两者的区别：鼠标右击效果：代码： ...

2020-06-06 10:44:31 312

原创 DOM移动图片放大

图片放大（鼠标移动左边图片右面放大并且移动位置右侧放大位置）： 1.效果如下： 2.代码如下：

2020-06-06 09:13:33 288

原创 DOM鼠标拖拽位置移动

鼠标拖拽：效果展示： 2.拖动完成后效果： 3.代码如下：

2020-06-06 08:50:19 277

原创 DOM操作一

DOM方法： getElementsByClassName() //方法返回文档中所有指定类名的元素集合 getElementsByName() //方法可返回带有指定名称的对象的集合。 getElementsByTagName()// 方法返回带有指定名称的所有元素的 NodeList。 getElementById()//方法返回id的名称 children //方法返回返回被选元素的所有直接子元素。 parentElement//查找父级元素 nextElementSibling// 属性返回指定元

2020-06-02 19:50:01 492

原创 cookie

cookie有效期的存储： let obj = { name: "nickname", val: "ace" } let now = new Date() now.setDate(now.getDate() + 7) document.cookie = `repe=${JSON.stringify(obj)};expires=` + now.toUTCString() console.log(document.cookie); setTimeout(() =&gt

2020-05-30 09:34:27 305

原创递归函数求和

递归 1.递归方式获取0-10数字之和： // 递归函数求和 var ar = [0,1,2,3,4,5,6,7,8,9]; function recursionCount(ar) { // 递归求和方式 let i = 0; function ordinary(n) { // 这个是递归函数 console.log(n) if (n >= ar.length -1 ) { // 递归结束条件 return; } i += ar[n]; // 执行逻辑 ordinary(n + 1) // 自

2020-05-30 09:25:52 2945

原创 JQ翻页二导航栏的覆盖

翻页二效果演示通过往下滚动鼠标黄色覆盖红色(同理鼠标往上滚动黄色消失红框出现) 3.代码部分: HTML部分： CSS部分： JQ部分：包括引入jq

2020-05-29 09:24:26 1730

原创 JQ翻页操作

翻转操作效果演示（这个效果是利用鼠标滚动事件：onmousewheel ）: 2.效果代码:（HTML、CSS、JQ） HTML部分： CSS部分： JQ部分: 引入jq：到此就已经完成了如果你想让你的页面滚动起来更流畅需要封装一个节流方法: 引入这个方法: ...

2020-05-29 09:10:22 937

原创 JS内置对象Math方法

向下取整：函数返回大于或等于一个给定数的最小整数：四舍五入：函数返回指定数字“ ”的绝对值绝对值：选最大值：最小值：生产随机数：返回值 boolean 为偶数,返回 true 说明是否为奇数范例：是否为奇数：生成随机整数： ...

2020-05-24 18:48:50 254

原创数组和字符串的方法

数组方法：十个常用的方法： arr.push()//在末尾添加元素 arr.pop（）//删除并返回末尾元素 arr.unshift（） //在开头添加元素 arr.shift（）//方法用于把数组的第一个元素从其中删除,并返回第一个元素的值 arr.slice（start,end）//截取 arr.join（）//数组转字符串 arr.reverse（） //翻转字符串 arr.concat[11,22]//拼接数组 arr.sort（）//排序 arr.splice(0,1)//从0开始，删除一个其

2020-05-20 20:52:28 250

Xu_Chen1的博客