![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
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 · 909 阅读 · 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 · 2805 阅读 · 0 评论 -
前端自动化部署
参考链接1参考链接2参考链接3原创 2021-06-17 10:16:49 · 801 阅读 · 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 · 320 阅读 · 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 · 1351 阅读 · 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 · 10932 阅读 · 1 评论 -
lodash的get方法
lodash的get方法原创 2020-03-18 16:46:20 · 530 阅读 · 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 · 19473 阅读 · 0 评论 -
判断一个对象是否为空
ES6新增的方法Object.keys():Object.keys()方法会返回一个由一个给定对象的自身可枚举属性组成的数组。如果我们的对象为空,他会返回一个空数组,如下:var a = {}Object.keys(a) // []我们可以依靠Object.keys()这个方法通过判断它的长度来知道它是否为空。if (Object.keys(object).leng...转载 2019-12-16 16:16:04 · 189 阅读 · 0 评论 -
js实现继承的几种方式
前言JS作为面向对象的弱类型语言,继承也是其非常强大的特性之一。那么如何在JS中实现继承呢?让我们拭目以待。JS继承的实现方式既然要实现继承,那么首先我们得有一个父类,代码如下:// 定义一个动物类function Animal (name) { // 属性 this.name = name || 'Animal'; // 实例方法 this.sleep = f...原创 2018-11-29 15:43:32 · 93 阅读 · 0 评论 -
原型
当我们创建一个对象时 let obj = { age: 25 },我们可以发现能使用很多种函数,但是我们明明没有定义过它们,对于这种情况你是否有过疑惑? 当我们在浏览器中打印 obj 时你会发现,在 obj 上居然还有一个 __proto__ 属性,那么看来之前的疑问就和这个属性有关系了。其实每个 JS 对象都有 __proto__ 属性,这个属性指向了原型。这个属性在...原创 2019-01-23 17:32:01 · 111 阅读 · 0 评论 -
js判断当前浏览类型是谷歌 、火狐、IE
https://blog.csdn.net/bossxu_/article/details/79966959原创 2019-01-22 10:47:09 · 254 阅读 · 0 评论 -
JS复制文本到粘贴板,前端H5移动端点击按钮复制文本到粘贴板。
方案一:最近做手机端H5网页里面有个活动:点击按钮复制邀请码。查过一些方法,在电脑端可以复制粘贴,一放在手机上面打开网页就不能复制粘贴了。直接进入正题使用开源项目 clipboard.js,官网:点击打开链接可以通过script标签引入也可以通过npm安装,npm install clipboard.js --save-dev。这个插件复制的对象必须是input 或者 ...原创 2019-01-21 18:48:08 · 3909 阅读 · 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 · 4160 阅读 · 0 评论 -
谷歌浏览器audio标签自动播放音乐问题解决
其他浏览器好像也不支持自动播放了,现贴出解决方案:1.在chrome 浏览器中输入:chrome://flags,搜索“Autoplay policy”,默认为“Default”,修改为 “No user gesture is required” 就可以了;此方法仅限谷歌浏览器,而且比较笨拙,但是问题可以解决;2.在使用video标签的过程中,设置静音播放,问题也可以得到解决,但是...原创 2019-01-24 16:10:00 · 12907 阅读 · 6 评论 -
h5页面预加载资源
因为不方便一一转载,我把链接放在下方。前端资源预加载并展示进度条 页面预加载loading动画,再载入内容使用HTML5的页面资源预加载(Link prefetch)功能加速你的页面加载速度H5前端性能优化之预加载知识 ...原创 2019-01-02 18:05:58 · 2986 阅读 · 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 · 4727 阅读 · 0 评论 -
关于swiper内容高度超出一屏问题,及解决方式。
原理:在内容位置区域,使用 e.stopPropagation();阻止事件冒泡(触发翻页),当滑动到顶部或者底部时,解除e.stopPropagation()。 .swiper-slide{ background-repeat: no-repeat; background-position: center center; ...原创 2018-12-28 14:36:00 · 3163 阅读 · 1 评论 -
谷歌浏览器audio标签自动播放音乐问题解决
转自:https://blog.csdn.net/a545132569/article/details/82996445前面一篇博客中有audio标签自动播放音乐的代码,可是后来再打开页面时音乐自动播放报错了;看了网上的一些帖子才知道原来在4月份谷歌浏览器做了改革,不止谷歌,其他浏览器好像也不支持自动播放了,现贴出解决方案:1.在chrome 浏览器中输入:chrome://fla...转载 2018-12-17 16:47:01 · 1644 阅读 · 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 · 79 阅读 · 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 · 157 阅读 · 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 · 1454 阅读 · 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 · 608 阅读 · 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 · 145 阅读 · 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 · 119 阅读 · 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 · 1322 阅读 · 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 · 375 阅读 · 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 · 4802 阅读 · 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 · 143 阅读 · 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 · 6283 阅读 · 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 · 17040 阅读 · 0 评论 -
表格溢出内容省略号显示,悬停显示全部
参考:https://blog.csdn.net/github_37517254/article/details/56012412原创 2019-03-07 15:35:02 · 428 阅读 · 0 评论 -
this的指向问题
参考:https://segmentfault.com/a/1190000015438195this的指向已经是一个老生常谈的问题,每逢面试都要去复习复习,近来巩固js的基础,决心彻底掌握这个知识点,一劳永逸。说明一下,为了不影响大家的思考过程,下面的代码都不会去注释答案,想知道答案,只需要去控制台执行一下。四类场景逐一击破首先,分析this的指向共有四种类型,在分析之前,我们首...转载 2019-03-05 15:53:59 · 84 阅读 · 0 评论 -
JavaScript Cookies
cookie 用来识别用户。实例创建一个欢迎 cookie利用用户在提示框中输入的数据创建一个 JavaScript Cookie,当该用户再次访问该页面时,根据 cookie 中的信息发出欢迎信息。什么是cookie?cookie 是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时,就会发送这个 cookie。你可以使用 JavaScript 来创建和取...原创 2019-02-13 11:47:41 · 96 阅读 · 0 评论 -
jquery 判断页面是第一次启动还是刷新 或者 是关闭还是刷新
一、刷新还是新建的判断方法jquery代码: if(!window.name){ alert("第一次开这个窗口!name值"+ window.name); window.name = 'test'; }else{ alert('刷新操作 name值:'+ window.name); ...转载 2019-02-12 19:02:54 · 2754 阅读 · 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 · 591 阅读 · 0 评论 -
HTML中节点和元素的区别,获取元素和节点,元素的创建,事件的绑定
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><script src="原创 2018-05-21 15:30:44 · 2279 阅读 · 0 评论 -
js原型及原型链
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>title</title> <script> //使用对象---->使用对象中的属性和对象中的方法,使原创 2018-05-25 23:36:08 · 90 阅读 · 0 评论 -
总结js对象和原型
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>title</title> <script> /* * * 复习: * * 面向过程和面向对象都原创 2018-05-22 19:22:39 · 146 阅读 · 0 评论 -
js的简单介绍
// * // * JavaScript简称:JS // * JS分三个部分: // * 1 ECMAScript标准---基础的语法 // * 2 DOM Document Object Model 文档对象模型 // * 3 BOM Browser Object Model 浏览器对象模型 // * 什么是JS? // * 是一门脚本语言 //...原创 2018-05-22 23:44:23 · 221 阅读 · 0 评论