js
文章平均质量分 73
WX_安琪拉打野怪
这个作者很懒,什么都没留下…
展开
-
前端解决跨域的九种方法
什么是跨域?跨域是指一个域下的文档或脚本试图去请求另一个域下的资源,这里跨域是广义的。广义的跨域:1、资源跳转:A链接、重定向、表单提交2、资源嵌入:<link>、<script>、<img>、<frame>等dom标签,还有样式中background:url()、@font-face()等文件外链3、脚本请求: js发起的ajax请求、dom和js对象的跨域操作等其实我们通常所说的跨域是狭义的,是由浏览器同源策略限制的一类请求场景。.转载 2021-06-20 00:11:33 · 181 阅读 · 0 评论 -
前端常用的排序算法
冒泡排序方法: 比较相邻两个数据的大小,将大的数据换到右边或者左边,这样将每一轮最大的值放在一端.时间复杂度为n²;该方法有两层for循环,一次数据交换;第一层是确定需要冒泡的次数;第二层循环是确定需要对比的次数;题外话: 脑袋里有个游戏场景还原这个算法. 假如这些需要比较的数字排成一列. 现在要对它进行排序,我们要做的就是拿着第一个数字与其他的数字进行比较,如果比自己手上拿的数字大,就拿上大的,留下小的,继续往前走,直到上次比较完最末的位置; 走完一轮继续下一轮,直到当前位置等于上次比较完的最末的原创 2021-01-04 19:45:00 · 221 阅读 · 0 评论 -
当try-catch-finally遇上return的执行顺序
1. return在try-catch-finally之外2. return在try中3. return在catch中4.return在finally中5.return在try与catch中6.return在try与finally中7.retrun在catch与finally中原创 2020-09-11 11:28:59 · 138 阅读 · 0 评论 -
promise, 异步,同步,定时器的执行顺序
通常情况下,js的执行顺序是从上到下的, 但是遇到定时器以及异步的时候情况会有所不一样.这时候想要理解它,得用宏任务以及微任务来解释了.js异步执行的机制是遇到宏任务就先执行宏任务,接着执行所有的微任务.然后再次从宏任务开始,找到其中一个任务队列执行完毕,再执行所有的微任务.微任务包括Promise、MutaionObserver、process.nextTick;宏任务包括setTimeout、setInterval、I/O等示例如下: console.log('js-start');原创 2020-08-31 12:01:18 · 2474 阅读 · 0 评论 -
vue单页项目常用优化
vue项目是单页应用,项目在第一次加载的时候会将大部分内容都加载进来,故而会导致加载很慢,以下是优化方案:1.使用cdn加载一些不常变化的文件,比如用到的UI框架,vue脚手架相关的文件 (参见vue项目优化--引入cdn文件)2.将静态的js,css以及图片放到第三方服务器3.按需加载路由4.webpack-parallel-uglify-plugin 可以优化打包js文件5.在代码层面进行优化:(1) 将重复的功能分块提取出来,封装成组件,让代码进行有效的复用(2) 尽量..原创 2020-08-02 17:15:39 · 149 阅读 · 0 评论 -
rel=preload进行内容预加载
背景<link>元素的rel属性的属性值preload能够让你在你的HTML页面中<head>元素内部书写一些声明式的资源获取请求,可以指明哪些资源是在页面加载完成后即刻需要的。对于这种即刻需要的资源,你可能希望在页面加载的生命周期的早期阶段就开始获取,在浏览器的主渲染机制介入前就进行预加载。这一机制使得资源可以更早的得到加载并可用,且更不易阻塞页面的初步渲染,进而提升性能。相关文档一般情况下<link>用来记载css文件<link rel...原创 2020-06-15 14:43:46 · 2510 阅读 · 0 评论 -
Vue-cli3.0引入全局预加载样式---以less为例
方式一: 自动化导入1.npm安装style-resources-loader2.在vue.config.js中添加以下代码: const types = ['vue-modules', 'vue', 'normal-modules', 'normal'] types.forEach(type => addStyleResource(config.module.rule('less').oneOf(type)))function addStyleResource(rule) {原创 2020-05-14 20:45:19 · 2056 阅读 · 0 评论 -
正则表达式(手动整理,手动编写)
1.验证0-100(不能等于0,等于100,精确小数点后两位)/^((0\.\d{0,2})|([1-9]{1,2}(\.[0-9]{1,2})?)|100)$/2.大于0的数字/^([1-9]\d*)$|^([1-9]\d*(\.\d{0,2}))$|^(0\.\d{0,2})$/原创 2019-07-22 20:52:41 · 151 阅读 · 0 评论 -
vue--前端接收后台传过来的excel文件数据,并在前端做下载
一.思路:1.利用Bold接收数据2.利用a标签做文件下载二.相关代码axios.post(url, queryParams, { responseType: 'arraybuffer' }).then((_res) => { const blob = new Blob([_res.data], { type: 'application/vnd.ms-ex...原创 2019-06-26 10:54:25 · 13484 阅读 · 3 评论 -
elementUI上传过程中限制尺寸
要点:1.上传之前的的钩子函数2.利用promise返回图片加载的状态代码如下:beforeAvatarUpload (res, file) { const isSize = new Promise((resolve, reject) => { let width = 220 let height = 220 le...原创 2019-06-25 14:49:42 · 1017 阅读 · 0 评论 -
js工具库(更新中......)
1.获取路径中的参数:function getUrlParams(href) { var theRequest = new Object(); if(!href) href = location.href; if(href.indexOf("?") !== -1) { var params = href.substr(href.inde...原创 2018-12-18 16:57:15 · 135 阅读 · 0 评论 -
js---数字精确小数点后两位
传入的参数可以是任意类型,如果不符合条件,则转换输出的数字为:0.00 function toDecimal2 (num) { var result = '0.00'; if(num) { var f = Math.round(parseFloat(num) * 100) / 100; if(!isNaN(f)) { result = f.toStri...原创 2018-11-21 17:30:06 · 1043 阅读 · 0 评论 -
页面的回流(reflow)和重绘(repaintd)
1.首先需要了解的是页面渲染过程(如下图所示):2.回流和重绘的概念:回流:浏览器重新构建render tree的过程重绘:浏览器根据render tree重新绘制界面的过程3.引起回流的操作当改变界面已有元素的位置,大小(width,height,border,padding,margin,content),或者新添加元素的时候,都会引起回流;每个页面至少有一次回流,也就是页面刚开始加载的时候4...原创 2018-04-17 19:06:03 · 486 阅读 · 0 评论 -
前端跨域及其解决方案
前端与服务端数据交互时,涉及到跨域的一些问题。JavaScript出于安全的考虑,禁止了跨域调用其他页面的对象,也即同源策略限制了一个源(origin)中加载文本或脚本与来自其它源(origin)中资源的交互方式。什么是跨域?如果两个页面拥有相同的协议(protocol),端口(如果指定),和主机,那么这两个页面就属于同一个源(origin),JavaScript 允许这种同源页面的数据互相通信。...转载 2018-05-10 11:16:31 · 274 阅读 · 0 评论 -
jquery数组遍历,终止循环&js数组遍历,终止循环
jquery 1.首先,上jquery源码:[javascript] view plain copyeach: function( obj, callback ) { var length, i = 0; //判断是否为数组 if ( isArrayLike( obj ) ) { length = obj.length...原创 2018-05-10 11:37:09 · 4344 阅读 · 0 评论 -
复杂数组以及对象的深度拷贝
javascript] view plain copy//测试用例 var obj = { name: "ceshi", age: 12, list: [{ name: "ceshi2", age: 13 },...原创 2018-05-10 11:38:09 · 306 阅读 · 0 评论 -
layer.open中的cancel中实现页面关闭的时候判断页面中input的数据是否更改
1.layer.open中的cancel回调方法cancel: function (index, layero) { var iframe=layero.find('iframe'); var docObj = iframe.length >= 1 ? iframe[0].contentDocument : null; var ismodify = isModify(doc...原创 2018-05-17 18:42:14 · 4674 阅读 · 0 评论 -
js的 new image()
本文转自https://blog.csdn.net/hdchangchang/article/details/9036511创建一个Image对象:var a=new Image(); 定义Image对象的src: a.src=”xxx.gif”; 这样做就相当于给浏览器缓存了一张图片。图像对象:建立图像对象:图像对象名称=new Image([宽度],[高度])图像对象的属性: bo...转载 2018-06-29 09:50:45 · 2201 阅读 · 0 评论 -
Promise 了解一下
1.概念Promise是异步编程的一种解决方案.它现被ES6收录原生提供了其对象2.特点(1)状态不受外界影响.Promise对象代表一个异步操作,有三种状态:pending(进行中),fulfilled(已成功)和rejected(已失败).只有异步操作的结果可以决定当前是哪一种状态,任何其他操作都无法改变状态(2)一旦改变就不会再变,任何时候都可以得到这个结果.Promise对象状态的的改变为...原创 2018-07-05 15:20:28 · 162 阅读 · 0 评论 -
JS实现根据对象之间的id以及pid构建目录树
1.遍历得到顶层节点 var resultObj = [] function fn(jsonData) { //取得顶级的数据 var baseNode = jsonData.filter(function(element) { return element.pid === 0 }) resultObj.push(.....原创 2018-07-18 14:19:05 · 1757 阅读 · 0 评论 -
js 类型检测(typeof进行检测)
1.js中的基本类型:字符串、数字、布尔、对象、Null、Undefined。而对象是个比较复杂的类型,其中又可以分为数组,函数与对象2.检测利用typeof来进行数据类型检测。它可以检测出来的数据类型有:string,number,boolean,function,undefined,object。数组,null与{}经过其转换后返回值都为object。所以重点就是怎么区分数组,nu...原创 2018-09-24 22:50:46 · 725 阅读 · 0 评论 -
构造函数创建对象
Function.prototype.a = 'a';Object.prototype.b = 'b';function Person(v) { this.v=v;};var p = new Person("aa");//以上代码是通过构造函数创建对象;//其过程为: //1.创建一个新的对象 //2.将构造函数的作用域赋给新的对象(因此其中的this就指向...原创 2018-04-17 16:03:32 · 241 阅读 · 0 评论