js
包淼淼
我是一只程序喵
展开
-
下载excel流文件及设置下载文件名
1、引入import axios from 'axios'const FileSaver = require('file-saver')2、具体实现handleDownload (id) { this.$loading({ text: '正在下载,请稍后...' }) axios({ url: `xxxx`, // 后端url地址 timeout: 10000, method: 'get',原创 2021-11-25 14:48:22 · 933 阅读 · 0 评论 -
requestAnimationFrame详解
参考链接参考链接原创 2021-10-30 21:51:30 · 26 阅读 · 0 评论 -
javascript总for of和for in的区别?
参考链接原创 2021-10-28 19:20:13 · 73 阅读 · 0 评论 -
前端基础思维导图
question 1var 和let const 区别var 是 ES5 语法,let const 是 ES6 语法;var 有变量提升var 和 let 是变量,可修改;const 是常量,不可修改let const 有块级作用域,var 没有typeof 返回哪些类型列举强制类型转换和隐式类型转换...原创 2021-05-14 17:10:11 · 116 阅读 · 0 评论 -
js 给数组原型对象添加方法
实例1:给Array本地对象增加一个原型方法,它用于删除数组条目中重复的条目(可能有多个),返回值是一个包含删除重复条目后的新数组function delRepeat(arr){ var subarr = []; for(var i=0; i<arr.length; i++){ if(subarr.indexOf(arr[i]) == -1){ subarr.push(arr[i]); } } return su原创 2021-09-10 17:26:22 · 2849 阅读 · 0 评论 -
前端自动化部署
参考链接1参考链接2参考链接3原创 2021-06-17 10:16:49 · 847 阅读 · 1 评论 -
JS-Web-API-存储
知识点cookie本身用于浏览器和 server 通讯被“借用”到本地存储来前端可用 document.cookie = ‘xxx’ 来修改题目描述cookie localStorage sessionStorage 区别cookie算是http请求的一部分,但也具备存储的能力...原创 2021-04-08 19:33:16 · 25 阅读 · 1 评论 -
使用input上传图片至七牛
<input type="file" accept="image/jpg" @change="getPositiveImg" class="input-upload" />getPositiveImg (el) { let file = el.target.files[0] this.type = 'positive' this.beforeUpload(file) }, async beforeUpload (file) { ..原创 2021-01-11 11:50:07 · 405 阅读 · 0 评论 -
vue canvas 签名组件,base64格式转图片,上传七牛
组件代码:<template> <div> <div id="canvas" ref="canvas"> <div id="clearCanvas" ref="clearCanvas" @click="clearSign">清除</div> <!-- <p id="saveCanvas" ref="saveCanvas">保存</p> --> </div&.原创 2020-10-30 19:28:49 · 1388 阅读 · 0 评论 -
JS判断数组对象中所有属性是否为空
我们平时提交表单的时候 需要用户填写所有信息 judgeObjectComplete(ObjectValue) { let flag = new Boolean() flag = true for (let key in ObjectValue) { if (ObjectValue[key]) {} else { flag = fals...原创 2020-04-28 16:10:26 · 10998 阅读 · 1 评论 -
lodash的get方法
lodash的get方法原创 2020-03-18 16:46:20 · 553 阅读 · 0 评论 -
Moment之 计算日期相差多少天
一、计算俩日期相差多少天//获取当前时间let m1 = moment();//获取需要对比的时间let m2 = moment(time);//计算相差多少天 day可以是second minuteday = m2.diff(m1, 'day');二、当前日期往后加多少天moment().add(30, "days").format('YYYY-MM-DD HH:mm:...转载 2019-12-16 16:32:37 · 19799 阅读 · 0 评论 -
判断一个对象是否为空
ES6新增的方法Object.keys():Object.keys()方法会返回一个由一个给定对象的自身可枚举属性组成的数组。如果我们的对象为空,他会返回一个空数组,如下:var a = {}Object.keys(a) // []我们可以依靠Object.keys()这个方法通过判断它的长度来知道它是否为空。if (Object.keys(object).leng...转载 2019-12-16 16:16:04 · 199 阅读 · 0 评论 -
js实现继承的几种方式
前言JS作为面向对象的弱类型语言,继承也是其非常强大的特性之一。那么如何在JS中实现继承呢?让我们拭目以待。JS继承的实现方式既然要实现继承,那么首先我们得有一个父类,代码如下:// 定义一个动物类function Animal (name) { // 属性 this.name = name || 'Animal'; // 实例方法 this.sleep = f...原创 2018-11-29 15:43:32 · 98 阅读 · 0 评论 -
原型
当我们创建一个对象时 let obj = { age: 25 },我们可以发现能使用很多种函数,但是我们明明没有定义过它们,对于这种情况你是否有过疑惑? 当我们在浏览器中打印 obj 时你会发现,在 obj 上居然还有一个 __proto__ 属性,那么看来之前的疑问就和这个属性有关系了。其实每个 JS 对象都有 __proto__ 属性,这个属性指向了原型。这个属性在...原创 2019-01-23 17:32:01 · 115 阅读 · 0 评论 -
js判断当前浏览类型是谷歌 、火狐、IE
https://blog.csdn.net/bossxu_/article/details/79966959原创 2019-01-22 10:47:09 · 265 阅读 · 0 评论 -
JS复制文本到粘贴板,前端H5移动端点击按钮复制文本到粘贴板。
方案一:最近做手机端H5网页里面有个活动:点击按钮复制邀请码。查过一些方法,在电脑端可以复制粘贴,一放在手机上面打开网页就不能复制粘贴了。直接进入正题使用开源项目 clipboard.js,官网:点击打开链接可以通过script标签引入也可以通过npm安装,npm install clipboard.js --save-dev。这个插件复制的对象必须是input 或者 ...原创 2019-01-21 18:48:08 · 3935 阅读 · 2 评论 -
js无法监听audio的ended事件
1、当你的audio标签里面有loop属性时<audio id="music2" loop preload autoplay="autoplay"> <source type="audio/mp3" src=""></audio>监听ended事件var Music2 = document.getElementById原创 2019-01-21 10:33:15 · 4249 阅读 · 0 评论 -
谷歌浏览器audio标签自动播放音乐问题解决
其他浏览器好像也不支持自动播放了,现贴出解决方案:1.在chrome 浏览器中输入:chrome://flags,搜索“Autoplay policy”,默认为“Default”,修改为 “No user gesture is required” 就可以了;此方法仅限谷歌浏览器,而且比较笨拙,但是问题可以解决;2.在使用video标签的过程中,设置静音播放,问题也可以得到解决,但是...原创 2019-01-24 16:10:00 · 12988 阅读 · 6 评论 -
h5页面预加载资源
因为不方便一一转载,我把链接放在下方。前端资源预加载并展示进度条 页面预加载loading动画,再载入内容使用HTML5的页面资源预加载(Link prefetch)功能加速你的页面加载速度H5前端性能优化之预加载知识 ...原创 2019-01-02 18:05:58 · 3030 阅读 · 0 评论 -
js实现逐行打字,逐段打字效果(最全)
1、以下是实现逐行打字的效果index.html。这里span之间不能有空格<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>打字机</title> <script原创 2019-01-04 15:35:14 · 4820 阅读 · 0 评论 -
关于swiper内容高度超出一屏问题,及解决方式。
原理:在内容位置区域,使用 e.stopPropagation();阻止事件冒泡(触发翻页),当滑动到顶部或者底部时,解除e.stopPropagation()。 .swiper-slide{ background-repeat: no-repeat; background-position: center center; ...原创 2018-12-28 14:36:00 · 3250 阅读 · 1 评论 -
谷歌浏览器audio标签自动播放音乐问题解决
转自:https://blog.csdn.net/a545132569/article/details/82996445前面一篇博客中有audio标签自动播放音乐的代码,可是后来再打开页面时音乐自动播放报错了;看了网上的一些帖子才知道原来在4月份谷歌浏览器做了改革,不止谷歌,其他浏览器好像也不支持自动播放了,现贴出解决方案:1.在chrome 浏览器中输入:chrome://fla...转载 2018-12-17 16:47:01 · 1677 阅读 · 0 评论 -
js深拷贝和浅拷贝
https://blog.csdn.net/weixin_37719279/article/details/81240658https://blog.csdn.net/baidu_36065997/article/details/80309991https://blog.csdn.net/Shauna_Wu/article/details/79508988浅拷贝是拷贝一层,深层次的对象...原创 2018-11-29 14:44:45 · 83 阅读 · 0 评论 -
js中的call、apply、bind方法
在JavaScript中,call、apply和bind是Function对象自带的三个方法,这三个方法的主要作用是改变函数中的this指向。call、apply、bind方法的共同点和区别:apply 、 call 、bind 三者都是用来改变函数的this对象的指向的;apply 、 call 、bind 三者第一个参数都是this要指向的对象,也就是想指定的上下文(函数的每次调用都会拥有...原创 2018-11-28 18:01:57 · 170 阅读 · 0 评论 -
h5 video标签安卓微信视频全屏
https://x5.tencent.com/tbs/guide/web/x5-video.htmlhttps://blog.csdn.net/u011384023/article/details/79669902 推荐看以上两个博客弄懂基本知识。下面代码已经实现在安卓微信视频的全屏播放。基本属性如下:<video id="videoALL" src="video/...原创 2019-01-29 17:03:36 · 1488 阅读 · 0 评论 -
单屏h5横屏详细介绍
这里是针对容器是1136*640的背景,关于rem的处理也是以1136*640为背景,并且横屏时页面不能上下滚动的情形 采用的swiper3,如下是背景图片<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="v原创 2019-02-21 18:49:54 · 632 阅读 · 0 评论 -
js函数中this指向的问题
<!DOCTYPE html><html lang="en"><head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <title>Document</title></hea原创 2018-05-25 23:28:45 · 150 阅读 · 0 评论 -
js数组与字符串的相互转换方法
1、数组转字符串需要将数组元素用某个字符连接成字符串,示例代码如下:var a, b;a = new Array(0,1,2,3,4);b = a.join("-"); //"0-1-2-3-4"2、字符串转数组实现方法为将字符串按某个字符切割成若干个字符串,并以数组形式返回,示例代码如下:var s = "abc,abcd,aaa";ss = s.split...原创 2019-08-20 10:38:32 · 123 阅读 · 0 评论 -
slice()、splice(),slice()、substring()、substr(), ES6 find 、findIndex,indexOf、includes区别
slice()与splice()的用法和区别参考:https://blog.csdn.net/wxl1555/article/details/79388292快速区分slice()、substring()、substr()参考:https://blog.csdn.net/qq_38209578/article/details/86086550es6 数组实例的 find() 和 f...原创 2019-06-12 17:44:49 · 1331 阅读 · 0 评论 -
js数组中的find、filter、forEach、map四个方法的详解和应用实例
参考:https://blog.csdn.net/lhjuejiang/article/details/80112547ES6 find 和 filter 的区别遇到个功能是要分类就想说在前端过滤,不要从查数据库的时候过滤了。然后就想说除了filter还有啥好用的发现有个find,测试一番之后发现const list = [{'name':'1',index:1},{'name'...转载 2019-06-12 17:20:12 · 413 阅读 · 0 评论 -
js中怎么删除对象的某个key值?js 遍历数组,有用!!
参考:https://blog.csdn.net/denghaolinzy/article/details/87913561formThead: { cate: false, id: true, out_trade_no: true, product_id: false, product: true, price: true, is_coupon: true, ...转载 2019-06-12 17:16:26 · 4831 阅读 · 0 评论 -
JSONP 的工作原理
参考:http://baijiahao.baidu.com/s?id=1596094573722602418&wfr=spider&for=pc1.JSONP的由来根据浏览器同源策略,所谓同源就是协议、主机、端口号都相同时成为同源。a 域的js不能直接访问 b域名的信息,但是script 标签的src属性可以跨域引用文件,jsonp是请求之后后台包装好一段json,并且...原创 2019-04-02 14:29:58 · 148 阅读 · 0 评论 -
the template root disallows 'v-for' directives
参考:https://blog.csdn.net/captian_900331/article/details/79908939具体问题的描述:<div v-for="article in articles" style="margin:13px"> <div class="article-image"> <a> ...原创 2019-06-13 21:30:40 · 6293 阅读 · 0 评论 -
html5 video 实时监测当前播放时间以及监测播放结束
<div class="vbox"> <video id="video" preload="auto" webkit-playsinline="true" x-webkit-airplay="true" playsinline x5-video-player-type="h5" x5-video-player-fullscreen=&quo原创 2019-03-13 10:48:42 · 17097 阅读 · 0 评论 -
表格溢出内容省略号显示,悬停显示全部
参考:https://blog.csdn.net/github_37517254/article/details/56012412原创 2019-03-07 15:35:02 · 451 阅读 · 0 评论 -
this的指向问题
参考:https://segmentfault.com/a/1190000015438195this的指向已经是一个老生常谈的问题,每逢面试都要去复习复习,近来巩固js的基础,决心彻底掌握这个知识点,一劳永逸。说明一下,为了不影响大家的思考过程,下面的代码都不会去注释答案,想知道答案,只需要去控制台执行一下。四类场景逐一击破首先,分析this的指向共有四种类型,在分析之前,我们首...转载 2019-03-05 15:53:59 · 103 阅读 · 0 评论 -
JavaScript Cookies
cookie 用来识别用户。实例创建一个欢迎 cookie利用用户在提示框中输入的数据创建一个 JavaScript Cookie,当该用户再次访问该页面时,根据 cookie 中的信息发出欢迎信息。什么是cookie?cookie 是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时,就会发送这个 cookie。你可以使用 JavaScript 来创建和取...原创 2019-02-13 11:47:41 · 99 阅读 · 0 评论 -
jquery 判断页面是第一次启动还是刷新 或者 是关闭还是刷新
一、刷新还是新建的判断方法jquery代码: if(!window.name){ alert("第一次开这个窗口!name值"+ window.name); window.name = 'test'; }else{ alert('刷新操作 name值:'+ window.name); ...转载 2019-02-12 19:02:54 · 2778 阅读 · 0 评论 -
微信浏览器无法使用reload()刷新页面
function refresh() { var random = Math.floor((Math.random() ** 10000) +1); var url = decodeURI(window.location.href); if (url.indexOf('?') < 0) { url = url + "?...原创 2019-04-02 13:52:40 · 636 阅读 · 0 评论