随笔分类 - 前端
摘要：服务器购买了3年，其中2020年基本没有去管他，最近https证书过期了，重新申请了证书，固做此记录： 配置https 使用阿里云免费提供的赛门铁克ssl证书，服务器类型：nginx 在aliyun搜索ssl，申请证书，一般第二天即可使用。 证书文件 下载的Nginx证书压缩文件解压后包含： .pe
阅读全文
摘要：``` let data = { "params": { "id": 514, "storeCode": "5139", "channelKey": "XINXIANG", "channelOrderSn": "2513920051119292641272", "status": "CHECKING", "return_type": "FULL", &quo
阅读全文
摘要：前言 每个真的程序员可能都想过要做一个自己的个人网站，很不幸我也是其中一个... 那么作为一个前端而言，页面这一边自然是没有问题，但是怎么部署到服务器、服务器的配置这些可能比较头疼，在2016年的时候，我其实做过一个个人的博客系统，虽然他的生命周期只有半年，但是当时服务器配置基本上是找运维的朋友搭的
阅读全文
摘要：目的 对前端线上代码错误进行排查，降低 JS Error 的错误量，加强h5在不同手机的webview的兼容性，提升代码质量，优化用户体验。 四个阶段 采集 1. 在index.html文件添加window.onerror全局监听。 2. 可能出现异常的代码块添加try catch，如JSON.pa
阅读全文
摘要：当然不乏有很多下拉刷新的插件可以直接使用，但是自定义程度不强，大部分都只能改改文字，很难满足设计师的创意，譬如淘宝和京东首页那种效果，就需要自己花心思倒腾了，最近刚好有这种需求，做完了稍微总结一下，具体看源码即可。 思路 1. touchstart 记录开始位置 2. touchmove 判断上拉、
阅读全文
摘要：做一个简单的记录，直接贴代码吧，主要还是设计师提供的那个json demo地址 "https://www.twobike.cn/demo/20181210/body movin.html" 官网地址 "https://www.lottiefiles.com/?page=1"
阅读全文
摘要：现在的一些数据运营活动h5页面中，通常回涉及到圆形的进度条，比如京东白条，蚂蚁芝麻分。最近做了一个类似的，当然前期想法是用canvas做，但是考虑到低端安卓手机的渲染能力，最终以纯原生css+js实现，总结一下 效果图 思路 index0底层一个色值 c1a76b的圆，中间index1一个三角形，也
阅读全文
摘要：现在你不会React/Vue都不好意思说自己是前端，不过我相信很多前端项目还是基于jquery类库的传统模式的，假如你有追求的态度使用过requireJs这个库，你一定思考过一个问题，或者说一种组件化的雏形思维，那就是运用一个模板引擎如artTemplate+requireJs实现一个单页面组件化的
阅读全文
摘要：1. 你是否厌倦了老是依赖后台去处理跨域，把握不了主动权 2. 你是否想模仿某个app倒腾一个demo，却困于接口无法跨域 那么很幸运，接下来我将现实不依赖任何后台，随心所欲的想访问哪个域名就访问哪个！ 下载nginx 地址： "http://nginx.org/en/download.html"
阅读全文
摘要：npm常用命令 1. npm list 查看当前目录下已安装的包 2. npm root g 查看全局安装的包的路径 3. npm help 查看全部命令 4. npm update/uninstall moduleName更新或卸载某个包 优雅的切换npm到cnpm 前端开发中肯定离不开npm，而
阅读全文
摘要：在像评论列表这样的前端页面中，经常会出现时间的字段，如果显示一个标准的yyyy MM dd HH:mm:ss这样的时间格式，显然不是很友好，通常产品会要求显示 [1分钟前]、[刚刚] 类似的文字，那么怎么用js实现呢？我这里封装了一个通用的函数以实现，贴出完整代码： 控制台输出如图
阅读全文
摘要：之前写过一篇 "先定一个小目标，自己封装个ajax" ，是基于原生js的，也就是jquery中ajax的简化版本实现的思路。众所周知，jquery的ajax是项目中最常用的请求后台的方式，也算是封装的很完美的api了，然而渐渐的我们会发现，其实还可以根据实际项目需要更优雅的进行一层封装，先看调用方式
阅读全文
摘要：去年6月份左右，加入了一个创业公司，很幸运做了一个从零开始的项目，前端工程由我一手搭建起来，并不断迭代功能到现在，有许多的感悟心得，在这里写点总结 确定框架、技术点 一个项目的开始，特别是丰富多样的前端工程，首先一定要确定好采用的框架和技术点。2016年vue.js如火如荼，webpack强势崛起，
阅读全文
摘要：如果是在pc端，监听输入框你可能想到focus、blur、hover、onkeyup这些事件，但是如果是在移动端使用使用这些事件用户体验极差，因为你要用户收起键盘并且再点个空白处才生效，甚至还存在很大的兼容差异。那么怎么解决呢？ 方案一 以前做一个简单的模糊搜索框的需求，大致思路是定义一个1s左右执
阅读全文
摘要：效果 首先看下效果，这是在h5页面中常见的一中文字展现方式，那么是怎么实现的呢？其实很简单 思路 用一个定时器将预制的文字通过.substring(0, i)方法不断的赋给要显示的区域，i在定时器里面迭代累加，当预制的文字跟显示区的文字相同时，清除定时器。 核心代码 html 深圳达农保险经纪有限公
阅读全文
摘要：在一些涉及到个人信息比较多的h页面，经常可能会出现复制账号到剪切板的功能，那么怎么用js怎么实现复制粘贴功能呢？正好最近开发的模块中又有一个这样的功能，总结一下，方便后面使用。 效果图 核心代码 这里require了一个js插件，插件里实现了复制（copy）、剪切（cut）、粘贴（paste）三个方
阅读全文
摘要：移动端开发中，左滑删除功能是很常见的，比如系统通知、微信聊天列表.. 最近在开发一个卡片式布局的h5页面中，就有一个这样的需求，于是我先写了一个dome，整理一下思路，顺便也简单写个总结。 思路： 有两个都是绝对定位的div层：内容和删除，内容width:100%，删除区域z index比内容区域小
阅读全文
摘要：前言 前端技术发展日新月异，随着模块化、组件化的提出，前端变得越来越复杂，静态资源越来越多，那么对静态资源的处理，如压缩，合并，去掉调试信息.. 如果还是人工去处理，效率非常之低且还容易出错，于是自动化的处理工具也就必然出现了。就像后端我们一般用maven管理项目，那么前端gulp是个不错的选择。
阅读全文
摘要：效果图 在移动前端开发中，这应该也是很常见的功能。如果是原生安卓或者ios，可能有现成的控件，当然实现这个效果的js插件也有很多。那么原生自己现实一个呢？ 整理思路：跟原生实现弹框很像，先有一个遮罩层，遮罩层上面是右侧导航栏，首先右侧导航栏right: -800px，再用css3 transitio
阅读全文
摘要：弹出层提示信息，这是移动前端开发中最常见的需求，你可能会想到一些流行的弹框插件，比如 经典的artDialog 炫酷的Sweetalert等等.. 但是慢慢地你其实会发现通常情况下需求定制化要求较高，一般的弹框插件可能只满足大部分要求，自定义花的时间还不如手动自己封装一个符合自己开发习惯的弹框组件，
阅读全文
