- 博客(22)
- 收藏
- 关注
原创 前端webSocket实现聊天消息&心跳检测&断线重连
封装socket.jsclass Socket { /** * @description: 初始化实例属性,保存参数 * */ constructor(options) { this.url = options.url; this.callback = options.received; this.name = options.name || 'default'; this.ws = null;
2021-01-05 11:33:16
1028
1
原创 原生javascript实现动效时间轴
实现效果如下:<section class="intro"> <div class="container"> <h1>Vertical Timeline ↓</h1> </div></section><section class="timeline"> <ul> <li> <div> <time>
2020-12-23 15:09:05
984
原创 原生javascript实现Todo list
实现效果如下:代码如下:<!--html--><div id="tasker" class="tasker"> <div id="error" class="error">Please enter a task</div> <div id="tasker-header" class="tasker-header"> <input type="text" id="input-task" placeholder="Ente
2020-12-23 14:56:20
421
原创 解决vue (ios系统内嵌H5) 返回上一页白屏
问题描述:进入A页面——>B页面——>ios自带的返回——>白屏出现——>手动点击白屏处——>问题解决;在vue的issues里面找到了同样的bug 【应该是ios 的锅】vue-issues原因:经过排查,发现在ios 机器上使用webview 开发Vue项目时候,go history (-1),无法将body 的高度拉掉,使得遮住,触发轻点击,方可消除该遮罩解决方法:在ajax返回数据后 加入以下代码:this.$nextTick(() => {
2020-11-19 11:13:34
2980
1
原创 解决vue (ios系统)键盘收起后-页面不回弹
解决vue (ios系统)键盘收起后-页面不回弹<input placeholder="请输入金额" v-model="number" @blur="handleScroll"/>handleScroll() { let scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0 window.scrollTo(0, Math.max(scrollHeight - 1, 0)
2020-11-17 11:20:23
886
原创 JavaScript根据对象某个属性进行排序
根据对象某个属性进行排序let objArr = [ {name: 'test1', age: 20}, {name: 'test1', age: 22}, {name: 'test1', age: 21} ] // 第一参数a, 第二参数b ---> a-b升序(从小到大);// b-a降序(从大到小),原理就是 两数计算,如果返回的是负数,// 就保留前者(我可能说的不对,欢迎纠正) objArr.sort((a, b) => { return a.
2020-11-10 11:31:13
227
1
原创 vue页面有弹层,禁止页面滚动
vue页面有弹层,禁止页面滚动data() { return { popupVisible: false},watch: { // 监听data中弹层状态 popupVisible(val) { if (val) { document.body.style.overflow = 'hidden' document.addEventListener('touchmove', function (e) { e.preventDefault()
2020-11-10 11:26:47
192
原创 vue实现H5页面滑动至指定位置
在Vue中,有三种方式可以实现H5页面滑动至指定位置方法1://先获取目标位置距离mounted() { this.$nextTick(() => { setTimeout(() => { let targetbox= document.getElementById('targetbox'); this.target= targetbox.offsetTop; }) })}//再滑动指定距离document.bo
2020-11-10 11:25:02
1852
1
原创 CSS JS实现文本溢出显示省略号...
单行文本溢出显示省略号overflow: hidden;text-overflow:ellipsis;white-space: nowrap;多行文本溢出显示省略号display:-webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp:3;overflow: hidden;截断一个字符串 用 ‘…’ 附加到结尾const truncateString = (str, num) => str.length >
2020-11-10 11:20:13
240
原创 H5页面(APP内嵌)- 真机调试
//CDN<script src="http://wechatfe.github.io/vconsole/lib/vconsole.min.js?v=3.2.0"></script><script src="https://cdn.bootcdn.net/ajax/libs/vConsole/3.3.4/vconsole.min.js"></script>//npmnpm i vconsole -S//页面调用<script>
2020-11-10 11:14:50
954
原创 JavaScript数组常用操作(去重)
数组去重ES6//new Setfunction unique(arr){ return Array.from(new Set(arr))}function unique(arr){ return [...new Set(arr)]}//filterfunction unique(arr){ if(!Array.isArray(arr)) return; ...
2020-04-20 11:03:50
109
原创 JavaScript常用操作方法(斐波那契数列)
斐波那契数列function fb(num) { if(num <=2){ return 1; }else{ return fb(num-1) + fb(num-2); }}
2020-04-20 11:03:20
151
原创 JavaScript常用操作方法(求N的阶乘)
js求N的阶乘function js(num){ if(num<=1) { return 1; }else{ return num * js(num-1); }}
2020-04-20 11:02:43
1482
原创 JavaScript数组常用操作(获取交集)
数组的交集function val(arr1,arr2) { return [...new Set(arr1)].filter(item => arr2.includes(item))}
2020-04-20 11:02:00
173
原创 JavaScript数组常用操作(获取随机元素)
获取随机元素arr[Math.floor(Math.random() * arr.length)]
2020-04-20 11:01:16
463
原创 JavaScript数组常用操作(值求和)
数组中的值求和ES6let sum = arr.reduce((x,y) => x + y);ES5let sum = 0;for(let i=0; i<arr.length; i++) { sum = sum + arr[i];}
2020-04-20 11:00:27
633
原创 JavaScript数组常用操作(平铺)
数组平铺//二维数组let flatArr = [].concat(...arr);//多维数组function flat(arr){ let flatArr = [].concat(...arr); return flatArr.some(item => Array.isArray(item)) ? flat(flatArr) : flatArr;}//n:...
2020-04-20 10:59:03
1369
原创 JavaScript数组常用操作(合并)
数组合并ES6...运算符let arr = [...arr1,...arr2];ES5concatlet arr = arr1.concat(arr2)
2020-04-20 10:57:58
208
1
原创 JavaScript常用操作方法(防抖和节流)
防抖函数短时间内大量触发同一事件,只会执行一次函数function debounce(func,wait) { let timer = null; return (...args)=> { if(timer) clearTimeout(timer) timer = setTimeout(()=>{ func.a...
2020-04-20 10:56:40
193
原创 JavaScript常用操作方法(排序)
冒泡排序冒泡排序算法的原理如下:比较两个相邻的元素,若前一个比后一个大,则交换位置第一轮的时候最后一个元素应该是最大的一个对所有的元素重复以上的步骤,除了最后一个function bubbleSort(arr) { for(let i=0;i<arr.length;i++) { for(let j=0;j<arr.length-i-1;j++) {...
2020-04-20 10:55:06
160
原创 JavaScript模拟实现new
模拟实现newfunction myNew(foo,...args) {// 创建新对象,并继承构造方法的prototype属性, 这一步是为了把obj挂原型链上 let obj = Objwct.create(foo.prototype); // 执行构造方法, 并为其绑定新this let result = foo.apply(obj,args); ...
2020-04-20 10:52:22
150
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人