![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
js
如梦难醒
这个作者很懒,什么都没留下…
展开
-
通过fetch请求下载文件(各种不同类型的附件)
一个通过fetch请求下载文件的方法,记录一下//url:完整附件地址 filename:文件名称(通常两者都是接口返回)downLoadByFetch(url, filename){ fetch(url,{ method: 'get', mode: 'cors' }).then(blob => { let a = document.createElement('a') let newUrl = window.原创 2021-06-29 18:20:41 · 2506 阅读 · 0 评论 -
js链式调用
链式调用在JavaScript 语言界很常见,如jQuery 、Promise 等,都是使用的链式调用。链式调用可以让我们在进行连续操作时,写出更简洁的代码。简单的实现代码如下:function Person() {}Person.prototype.name= function(name) { alert("my name is "+name); ...原创 2020-04-09 15:58:28 · 231 阅读 · 0 评论 -
Async/Await与Promise区别
自从Node的7.6版本,已经默认支持async/await特性了。如果你还没有使用过他,或者对他的用法不太了解,这篇文章会告诉你为什么这个特性“不容错过”。本文辅以大量实例,相信你能很轻松的看懂,并了解Javascript处理异步的一大杀器。初识Async/await对于还不了解Async/await特性的同学,下面一段是一个“速成”培训。Async/await 是Javascr...转载 2020-04-08 15:55:08 · 2503 阅读 · 0 评论 -
js控制最大并发请求实现,promise
背景通常,我们在需要保证代码在多个异步处理之后执行,会用到:Promise.all(promises:[]).then(fun:function);Promise.all可以保证,promises数组中所有promise对象都达到resolve状态,才执行then回调。这时候考虑一个场景:如果你的promises数组中每个对象都是http请求,或者说每个对象包含了复杂的调用处...转载 2020-03-11 15:45:25 · 6648 阅读 · 1 评论 -
判断某个变量是否为数组(判别其它类型可类比某些方法进行)
自己整理的比较简单和常用的三种方法去判断某个变量是不是为数组第一种方法 instanceof:function checkIsArray(arr){ return arr instanceof Array;}第二种方法 直接使用array的一个方法 =>isArray:function checkIsArray(arr){ return ...原创 2020-03-04 18:13:11 · 177 阅读 · 0 评论 -
数组内的对象去重(基于对象的某个字段)
一.非es6方法://去重方法function filterSame(arrays){ var obj = {}; var newArrays= []; for(var i =0; i<arrays.length; i++){ if(!obj[arrays[i].id]){ arrays.push(arrays...原创 2020-02-12 18:14:27 · 344 阅读 · 0 评论 -
前端要持续监听事件的性能优化(节流/防抖),scroll方法为例。
以滚动事件为例吧,移动端要实现一个简单的滚动到底部加载下一页的需求,就需要监听页面的scroll事件了代码如图:let timeOutFn = false; //$(window).scroll(function () { //监听窗口的滚动事件 clearTimeOut(timeOutFn); //100毫秒内仍然执行滚动就把需要执行的逻辑清除掉,停下来在执行具体函...原创 2020-01-09 12:59:25 · 2194 阅读 · 0 评论 -
canvas的图片与img图片互转(生成base64编码的图片)
canvas图片转img标签的base64编码地址 js代码片段如下://从网页中的canvas标签中提取图片function convertCanvasToImage(canvas) { var image = new Image(); // canvas.toDataURL 返回的是一串Base64编码的URL // 指定格式 PNG ...原创 2019-10-08 14:47:43 · 876 阅读 · 0 评论 -
iPhone手机上h5页面输入内容后,失去焦点页面底部有空白问题解决
这真是一个cd的问题,这ios也太傲娇了吧在页面的input框输入完成后,它竟然就挂在那里了,底部的按钮一直在屏幕的中部,多出了一大块空白,要手动滑动几次才能回复正常,不自动归位,真的cd。解决办法如下:jq方法:$("input").on("blur",function(){ //设置屏幕滚回到顶部,很简单很粗暴 window.scroll("0,0");})事情就...原创 2019-08-08 11:10:02 · 1885 阅读 · 0 评论 -
关于使用display:flex的弹性布局,结合js实现最后一行自动左对齐(跪求纯css实现的方法)
一个考验基本功的功能,而我现在也才用了最流行的一种方法,希望看到的有思路的可以写下自己的做法,一整段代码如下:实现思路:通过获取父元素的宽度以及子元素宽度进行一系列计算,补齐最后一行,达到justify-content:wrap的时候,依旧完美左对齐<html> <head> <title></title> ...原创 2019-06-28 18:22:41 · 1291 阅读 · 1 评论 -
通过递归的方法使用setTimeout模拟setInterval行为
今天在优化项目的代码时候用到了递归方法,然后看到网上一个有趣的题目:怎么用setTimeout模拟setInterval行为?感觉挺过瘾的,就去实现了一下,果然有趣,直接上代码吧://实现的方法挺简单的 ,如下代码//参数: 毫秒 需要执行的方法function setInter(s,fn){ let timeOut = (s,fn)=>{ setTimeou...原创 2019-07-03 17:54:08 · 3784 阅读 · 0 评论 -
js去除字符串中的所有空格(包括前后,中间存在的所有空格),清除前后空格(手机输入框实用),es6新方法
一、js去除字符串中的所有空格: str = " hello world ! " str.replace(/\s/g,""); 感觉很好用。二、去除左右空格:rtrim =(str)=>{ //删除左右两端的空格 return str.replace(/(^\s*)|(\s*$)/g, "");}以上是正...原创 2018-01-17 16:28:55 · 46027 阅读 · 5 评论 -
js相关的localStorage 设置、删除,过期操作
<script type="text/javascript"> //封装过期控制代码 function set(key,value){ var curTime = new Date().getTime(); localStorage.setItem(key,JSON.stringify({data:value,time:curTime})); ...转载 2018-01-29 15:23:49 · 11107 阅读 · 0 评论 -
普通方式绑定事件 和 用ADDEVENTLISTENER 添加事件有什么区别
1、onclick添加事件不能绑定多个事件,后面绑定的会覆盖前面的。2、addEventListener方式,不支持低版本IE。3、普通方式绑定事件后,不可以取消;addEventListener绑定后,可以用removeEvenListener 取消;4、addEventListener的用法:target.addEventListener(type, listener, useCapture)...转载 2018-03-15 10:55:43 · 470 阅读 · 0 评论 -
跨域处理
首先了解下浏览器的同源策略同源策略/SOP(Same origin policy)是一种约定,由Netscape公司1995年引入浏览器,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,浏览器很容易受到XSS、CSRF等攻击。所谓同源是指"协议+域名+端口"三者相同,即便两个不同的域名指向同一个ip地址,也非同源。那么怎样解决跨域问题的呢?1 通过jsonp跨域,原生实现:<scri...转载 2018-03-13 21:04:46 · 195 阅读 · 0 评论 -
当浏览器窗口大小改变时候,动态获取当前浏览器窗口的可视高宽
当浏览器窗口大小改变时候,动态获取当前浏览器窗口的可视高宽:window.resize = function(){ console.log("浏览器可视高度"+$(window).height()); console.log("页面Body高度"+$(document.body).height()); console.log("浏览器可视宽度"+$(window...原创 2017-11-07 10:05:11 · 3745 阅读 · 0 评论 -
handlebar.js模板使用方法简记
之前在项目中用到的一个模板引擎,用起来挺简单的,也还不错1.引入模板<script src="../js/handlebars.js"></script><div class="this-site"></div>2.生成模板<script type="text/template" id="list_tpl"原创 2018-03-20 14:09:44 · 527 阅读 · 0 评论 -
通过jquery动态设置下拉框select的选中值option
虽然简单,但是用得比较少,自己按照select的选中原理,直接撸出来,然后做出跟百度出来的结果对比了一下,发现百度出来的东西太繁琐了,效果实现了,但是本着代码要简洁的心,我还是用了自己的方法,记录一下结构如下:<select> <option class="option-1">广东</option> <option class="option-...原创 2018-03-30 10:29:11 · 13436 阅读 · 2 评论 -
js三种创建对象的方法
javascript是一种“基于prototype的面向对象语言“,与java有非常大的区别,无法通过类来创建对象。那么,既然是面象对象的,如何来创建对象呢?一、通过”字面量“方式创建。方法:将成员信息写到{}中,并赋值给一个变量,此时这个变量就是一个对象。例如: var person = (name:'dongjc', work:function() {console.log('write co...转载 2018-04-02 16:37:41 · 170 阅读 · 0 评论 -
根据经纬度,计算地图两点之间的距离(可在高德地图api接口验证结果是否正确)
function getdistance($lng1,$lat1,$lng2,$lat2){ //将角度转为狐度 $radLat1=deg2rad($lat1);//deg2rad()函数将角度转换为弧度 $radLat2=deg2rad($lat2); $radLng1=deg2rad($lng1); $radLng2=deg2rad($lng2); $a=$radLat1-$radLat2; ...转载 2018-06-25 10:32:50 · 11243 阅读 · 0 评论 -
js实现上移、下移置顶
html>head>metacharset="utf-8">metahttp-equiv="X-UA-Compatible"content="IE=edge,chrome=1">title>使用js实现上移、下移、置顶、置底功能及源码案例title>metaname="description"content="">metaname="keyw转载 2017-11-21 15:30:59 · 3964 阅读 · 0 评论