![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端技术
文章平均质量分 67
huanmeng122
这个作者很懒,什么都没留下…
展开
-
Vue2实现动态路由配置
首先明确,路由挂载时只挂载静态路由。转载 2023-05-04 16:05:05 · 517 阅读 · 0 评论 -
axios封装,开箱即用···
封装一个好用的axios,请求拦截,下载拦截,请求域名地址修改,登录错误重新登录页原创 2023-03-07 11:24:19 · 361 阅读 · 0 评论 -
ts封装axios,多个实例灵活配置,拦截提示。
写在前面虽然说Fetch API已经使用率已经非常的高了,但是在一些老的浏览器还是不支持的,而且axios仍然每周都保持2000多万的下载量,这就说明了axios仍然存在不可撼动的地位,接下来我们就一步一步的去封装,实现一个灵活、可复用的一个请求请发。这篇文章封装的axios已经满足如下功能:无处不在的代码提示;灵活的拦截器;可以创建多个实例,灵活根据项目进行调整;每个实例,或者说每个接口都可以灵活配置请求头、超时时间等;取消请求(可以根据url取消单个请求也可以取消全部请求)。基础封装转载 2022-04-07 09:57:26 · 2271 阅读 · 0 评论 -
JS高级应用--防抖、节流、数组扁平化、柯里化、对象拷贝
JS高级应用--防抖、节流、数组扁平化、柯里化、对象拷贝防抖节流数组扁平化柯里化对象拷贝防抖,浏览器resize、scroll、keypress、mousemove等事件触发时,会不断的调用绑定在事件上的回调函数,浪费资源、降低性能,为了优化体验,对这类事件调用次数限制。原创 2022-02-24 15:44:12 · 387 阅读 · 0 评论 -
经常需要用到的34种JS优化技巧
你可能做了很长时间的 JavaScript 开发,但有时候你可能没有使用最新的 JavaScript 特性或技巧,这些特性和技巧可以在不需要编写额外代码的情况下解决你的问题。它们可以帮助你写出干净且优化的 JavaScript 代码。此外,如果你在 2021 年准备去参加面试,可以参考本文的内容。1. 带有多个条件的 if 语句把多个值放在一个数组中,然后调用数组的 includes 方法。//longhandif (x === 'abc' || x === 'def' || x === 'ghi'转载 2021-07-05 12:12:06 · 315 阅读 · 0 评论 -
vue初始化项目后,git提交到gitee远程仓库
vue初始化项目后,git提交到gitee远程仓库使用vue create 初始化cli3项目后,在git新建仓库,使用git工具提交到gitee远程仓库直接使用“git remote add origin https://gitee.com/huanmeng122/preparation.git”提交后,会提示错误:fatal: remote origin already exists.翻译如下:fatal: remote origin already exists.致命:远程源已存在。需原创 2021-05-18 17:38:57 · 688 阅读 · 0 评论 -
如何精准判断数据类型
如何精准判断数据类型typeof 实现原理Object.prototype.toStringinstanceof 操作符总结typeof 实现原理typeof 一般被用于判断一个变量的类型,我们可以利用 typeof 来判断number, string, object, boolean, function, undefined, symbol 这七种类型,但是,很遗憾的一点是,typeof 在判断一个 object的数据的时候只能告诉我们这个数据是 object, 而不能细致的具体到是哪一种 objec原创 2020-11-17 21:42:26 · 397 阅读 · 0 评论 -
如何获取Google地图API密钥?
如何获取Google地图API密钥?使用Google地图的用户需要注意了!Google地图于2016年6月22日更新了Google地图API接口,更新接口后必需要申请Google地图API密钥才可以使用Google地图。如果您以前引用的Google地图中没有设置API密钥,可能会在页面上出现报错提示:“Oops! Something went wrong. This page didn’t l...翻译 2019-08-21 23:08:56 · 8385 阅读 · 0 评论 -
测试 JavaScript 函数的性能
在软件中,性能一直扮演着重要的角色。在Web应用中,性能变得更加重要,因为如果页面速度很慢的话,用户就会很容易转去访问我们的竞争对手的网站。作为专业的web开发人员,我们必须要考虑这个问题。有很多“古老”的关于性能优化的最佳实践在今天依然可行,例如最小化请求数目,使用CDN以及不编写阻塞页面渲染的代码。然而,随着越来越多的web应用都在使用JavaScript,确保我们的代码运行的很快就变得很重要...转载 2018-12-08 09:18:53 · 434 阅读 · 0 评论 -
Ajax跨域访问出现Uncaught SyntaxError: Unexpected token : 解决方案
在访问外网提供的Api时出现跨域问题,尝试使用普通方式JSONP解决,但是出现Uncaught SyntaxError: Unexpected token : 的错误,所有专注于研究ajax请求跨域问题,在前人基础上逐渐理出脉络,以此记之,希望对大家有所帮助。搜罗资源比较杂乱,所有看到“撒网要见鱼”的一篇文章,下面的内容以此为蓝本,加入自己的总结。感谢“撒网要见鱼”。关于跨域,有N种类型,本文...原创 2018-08-08 15:35:59 · 123364 阅读 · 5 评论 -
fetch API获取返回值的方式
使用fetch API来做后端请求,相比较传统的Ajax方式,在写出的代码上更加容易理解,也更便于别人看懂。但是在使用的过程中,经常有同学不能顺利从传统的Ajax请求(如果使用jquery的话,就是$.ajax,$.post,$.get)转移到新的fetch方式,很多时候就是卡在了获取响应数据的环节上。用fetch来获取数据,如果响应正常返回,我们首先看到的是一个response对象,其中包括返回的转载 2017-11-11 10:51:48 · 19141 阅读 · 2 评论 -
fetch 使用,如何能够接收JS的传值
fetch 使用,如何能够接收JS的传值使用fetch基本方式:fetch('https://mywebsite.com/endpoint/', { method: 'POST', headers: { 'Accept': 'application/json', 'Content-Type': 'application/json'}, body: JSON.stringify原创 2017-11-11 09:58:34 · 2161 阅读 · 0 评论 -
欢迎使用CSDN-markdown编辑器
互联网架构设计:高性能的前端当我们讨论互联网产品高性能架构的时候,往往聚焦在高性能的后端服务。其实用户是通过客户端前端来直接体验互联网产品的,前端高性能设计也是很重要的。用户使用互联网产品的基本流程如下图。用户使用电脑Web浏览器或者手机App来直接使用互联网产品服务,用户终端将会把用户的操作行为请求到网站服务器,网站服务器对请求进行响应,用户终端(Web浏览器或者手机App)将解析服务器的响应进行转载 2017-08-09 15:25:10 · 168 阅读 · 0 评论 -
移动端网页开发经验与心得-分辨率、内容与缓存
智能手机发展确实很迅速,像今年,我的大部分工作就都在移动端网页上。 再往前些年,看到的手机版/移动版网页,限制于浏览器与手机性能,2g网络速度等 网页设计无非是蓝、黑、白,界面单调,并且要尽可能的设计简单。 现在情况就大不相同了,软件上webkit内核浏览器大行其道,硬件突飞猛进,网速来说,4g正炒得火热。 下面就和大家分享一下我的一些移动端网页设计经验与心得。1、分辨率这应该是移动端网页最转载 2015-09-11 16:40:52 · 1151 阅读 · 0 评论 -
从css3书写顺序引出来的border-radius参数
当时写这篇文章主要是想探讨一下优雅降级和渐进增强的区别,按照正常的逻辑思维,不管是降级还是增强,应该对于效果是没什么区别的,因为后者会覆盖前者,关于CSS3属性的书写顺序,标准的css3属性和带webkit的前缀在某些情况是不一样的效果,比如border-radius和-webkit-border-radius带两个参数时,显示的效果并不一样:.not-a-square { border-ra转载 2015-09-16 08:42:51 · 531 阅读 · 0 评论 -
浅析CSS——元素重叠及position定位的z-index顺序
HTML5有无限可能,总是在释出一些新鲜实用的功能,让原生的web环境更加炫酷。今天看到datalist 这个元素,可以用来预先定义一个输入框的潜在选项,也就是我们在平时项目中经常用jQuery插件或者自己写JS来实现的autocomplete「自动补全,但似乎自动提示更贴切一些」功能。具体来说,页面上的input还是原来的input,只是在它的下面定义一下新的datalist在其中填充触发提示的文转载 2015-12-19 08:33:25 · 337 阅读 · 0 评论 -
chrome浏览器设置小于12号的字体不起作用?
在某些chrome浏览器下,css里设置的10号字体竟然不起作用!仍显示12号大小,对比firefox、ie6、7、8、9,他们的显示都是好的。要是你也碰到这问题,可以这样解决:-webkit-text-size-adjust: none;在css里加上这一句就可以。如你的样式是这样 .copyright{ font-size:10px; background-color:#ee转载 2016-04-29 09:27:53 · 930 阅读 · 0 评论 -
页面性能优化的34条黄金守则
页面性能优化的34条黄金守则转载 2016-04-29 10:37:51 · 745 阅读 · 0 评论 -
input keyup 500ms 延时输入 事件处理
==================input keyup 500ms 延时输入 事件处理==================var last;$(".input").keyup(function(event){//.input为你的输入框 last = event.timeStamp; //利用event的timeStamp来标记时间,这样每次的keyup事件都会修改转载 2016-07-12 10:02:21 · 946 阅读 · 0 评论 -
jQuery点击自身以外地方关闭弹出层-closest()
百度,谷歌搜索时出现的提示框,点击输入框外部任意地方后,隐藏提示框。但是通过jquery怎么实现这个交互效果呢,closest()函数转载 2016-07-13 08:43:45 · 9715 阅读 · 1 评论 -
如何解决inline-block元素的空白间距
有关于使用inline-block来代替float的讨论也蛮多的,最常说的就是使用inline-block来代替float进行布局,或者使用inline-block来实现元素的居中效果。前面《CSS3制作的分页导航》一文中就是使用的inline-block制作的居中效果,不过留下了一上问题,就是使用inline-block的元素之间会存在“4px”的空白间距。那么今天我们就一起来说说这个“4px”的转载 2016-06-18 09:15:30 · 368 阅读 · 0 评论 -
HTML5中的Web Notification桌面通知
HTML5 Web Notification通知是属于桌面性质的通知,有点类似于显示器右下角蹦出的QQ弹框,杀毒提示之类的,跟浏览器是脱离的,消息是置顶的。转载 2016-09-20 10:58:18 · 884 阅读 · 0 评论 -
通过预加载器提升网页加载速度
预加载器(Pre-loader)可以说是提高浏览器性能最重要的举措。Mozilla 官方发布数据,通过预加载器技术网页的加载性能提升了19%,Chrome测试了 Alexa 排名前2000名网站,性能有20%的提升。它并不是一门新技术,有人认为只有 Chrome 才具备这个功能。也有人认为它是有史以来提升浏览器性能最有效的方法。如果你第一次接触预加载器,也许心中已经有了无数个问号。什么是预加载器?转载 2015-08-21 16:39:37 · 437 阅读 · 0 评论