前端技术
锋清杨
在探索代码乐趣中渐渐发狂。
展开
-
前端取消重复请求并缓存接口数据
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录背景一、示例背景前端开发时常遇到用户恶意高频率提交请求接口,如点击查询,1s内请求多次查询接口,这样的请求对前后端实际业务来说没有任何功能反馈,徒增了接口带宽压力。需要在接口请求方法中封装在一定时间内取消重复请求的工具函数,使用fetch或axios库都可以实现取消重复请求的操作,但在network中还是有用户感知的接口cancel显示。为此使用Map方式缓存接口,在相同请求再次进来时使用上一次的缓存数据,就不再去调用接口.原创 2022-05-27 16:52:35 · 784 阅读 · 1 评论 -
Create-React-App自定义配置
1.在根目录下新建.env文件GENERATE_SOURCEMAP=false //是否开启sourcemapIMAGE_INLINE_SIZE_LIMIT=20000 //图片转base64的大小限制INLINE_RUNTIME_CHUNK=false //开启runtime-chunk文件EXTEND_ESLINT=false //开启扩展ESLINTPUBLI...原创 2019-11-29 10:19:30 · 767 阅读 · 1 评论 -
原生js封装jsonp,解决跨域问题
function jsonp(url, options) { // 创建script标签 var $script = document.createElement('script'); // 解决缓存问题 var f = url.indexOf('?') > - 1 ? '&' : '?'; url += f + '_=' + Date.no...原创 2018-10-15 15:38:16 · 1041 阅读 · 0 评论 -
原始js封装cookie
function OperationCookie () {}// 设置cookie值OperationCookie.prototype.setItem = function(name, val, day) { document.cookie = name + '=' + val + '; max-age=' + day * 24 * 60 * 60 + ';'; }// 获取c...原创 2018-10-15 15:36:59 · 211 阅读 · 0 评论 -
js检测数据类型方法总结
1.常用方法typeofvar str=‘abc’;console.log(typeof str)//string2.判断已知对象类型的方法: instanceofvar str='abc';console.log(str instanceof String);//true3.万能判断法:利用原型链 function checkType (val) { ...原创 2018-09-28 20:12:34 · 372 阅读 · 0 评论 -
原生js利用图灵机器人实现自动回复功能
HTML代码:<style type="text/css"> * { padding: 0; margin: 0; } .imgLayout { width: 100%; height: 100%; margin: 0 auto; padding: 1px; } .outer { box-sizing: borde...原创 2018-09-28 10:19:27 · 3929 阅读 · 1 评论 -
实现百度搜索框提示语功能
利用百度jsonp接口实现搜索提示语.jsonp.js封装function jsonp(url, options) { // 创建script标签 var $script = document.createElement('script'); // 解决缓存问题 var f = url.indexOf('?') > - 1 ? '&' : '...原创 2018-09-27 20:35:24 · 2001 阅读 · 0 评论 -
表格数据的增删改
html代码: <button id="btn">根据年龄排序</button> <table border="1"> <thead> <tr> <th>姓名</th>原创 2018-09-10 19:51:26 · 246 阅读 · 0 评论 -
js轮播图封装
banner.js结合move.js实现封装轮播图banner.js代码var swiper = (function() { var timer = null; return { init(ele) { if(typeof ele == 'string') { ele=document.querySelector(ele) } this.ele = el...原创 2018-09-12 20:02:32 · 1621 阅读 · 0 评论 -
js+html+css实现本地聊天室
欢迎访问我的个人博客:http://mrzyf.club.代码完成效果:话不多说,直接上代码——css代码:<style type="text/css"> .talk_con { width: 600px; height: 700px; bord...原创 2018-09-04 19:12:03 · 6356 阅读 · 5 评论 -
CSS水平和垂直居中技术
水平居中行内元素的水平居中text-align:center(在父元素中设置)只对内联元素或行内块元素有效 需要放置于父元素中块级元素的水平居中margin: 0 auto;只对块级元素有效 auto指的是自适应宽度。实质就是均分了元素左右的剩余空间,所以元素会居中。 auto只有在块级元素设置了宽度width才有效(块级元素不设宽度默认就占整行了,所以是废话) auto...原创 2018-08-26 15:10:27 · 143 阅读 · 0 评论 -
探索node.js--02使用express搭建项目
1.介绍expressExpress 是一个基于 Node.js 平台的极简、灵活的 web 应用开发框架,它提供一系列强大的特性,帮助创建各种 Web 和移动设备应用。他提供了丰富的API,性能也更加强大了。所以用express搭建node.js项目更加方便灵活。2.express安装express是开源框架,安装简单,一台联网电脑即可。打开cmd 输入npm install express命...原创 2018-07-05 14:43:59 · 332 阅读 · 1 评论 -
探索node.js—01开篇
Node.js是一个Javascript运行环境(runtime environment),发布于2009年5月,由Ryan Dahl开发,实质是对Chrome V8引擎进行了封装。Node.js对一些特殊用例进行优化,提供替代的API,使得V8在非浏览器环境下运行得更好。V8引擎执行Javascript的速度非常快,性能非常好。...原创 2018-07-04 08:34:02 · 237 阅读 · 0 评论