- 博客(26)
- 收藏
- 关注
RSS订阅转载 【原】页面加载编译优化
先说一下项目背景框架vue的技术体系，cli2.0这是项目优化中的一小部分但是我举得比较适用并且有效的在优化页面加载时间我之前已经做了一下的这些事这是最重要的一件事，加入前端监控，不然你是无法观察实际中的效果（之前自己写了个前端监控，但是你也可以使用阿里云监控需付费）网络层面1.开启gzip优化，自动压缩静态文件2.开启自动智能压缩（brotl...
2019-09-05 17:11:00
260
转载 两年后再次更新博客随笔
叙述很神奇我居然那么长时间没有写技术是不是技术也很久没有沉淀了呢这两年换了一家公司加班比较多比较忙，有时候发版还会到凌晨之后但是我觉得还是是必须沉稳下来不应该那么浮躁我想我需要思考，职业的发展，技术的发展，各种的规划所以我动手用捋一下过去，便于思考一下将来讲述现在的工作重心从之前的后台系统转移到了移动端自己搭建项目，修改项目配置，框架，提高开发效...
2019-08-20 15:13:00
300
转载 解决前端调试接口，跨域环境
一、介绍其实跨域是浏览器本身限制阻止的，为什么就是因为超级不安全前端和后台调试接口时，最主要的麻烦就是跨域导致的，怎么解决，提供以下几种方法二、方法1、后端在接口文件写一段（这是最简单方法，但是）1 // 指定允许其他域名访问 2 header('Access-Control-Allow-Origin:*'); 优点：对于前端来说十分之简...
2017-05-19 19:16:00
722
转载 监听滚动条动态加载
最近做了个聊天的项目所以需要向上滚动然后动态加载，于是我就把这一块单独提取出来弄成插件。下面就是实现的效果$.fn.extend({ scrollDetect: function(path, callback){ var self = this; self[0].nodeScrollArr = { ...
2017-03-20 16:16:00
230
转载 div拖拽
分析逻辑关于该过程有一下3个动作1、点击 2、移动 3、释放鼠标1、点击时获得点击下去的一点的坐标（盒子的top，left），去除默认事件。2、移动时不断改变盒子的坐标。（移动的dom目标应该为document不然容易被甩出去）。3、鼠标释放。清除document的时间。还有改变位置。4、注意如果鼠标在点击目标时速度太快离开了目标，要马上纠正。写了个简...
2017-03-16 15:55:00
231
转载 Fiddle用于移动端抓包
一、什么情况下可以用到1、调查参考其他移动端网站的抓包，他们传输方式。如微信上京东的智能机器人的包、移动端的请求接口格式、如何实现的效果等。2、调试本地移动端页面的测试页面效果是否有问题。如:页面的样式、js、结构等。二、操作(http)a、安装猎豹免费wif，弄一个本地的wifib、安装fiddler，用于抓包c、手机连接该wifi，设置代理配置如下：箭头...
2017-03-16 10:53:00
199
转载 Js 组合键
同时按Ctrl+Enter或Alt+s先上html代码1 <style type="text/css">2 #box{width: 500px; height: 500px;}3 </style>4 <body>5 <!-- 需要研究清楚 ctrlKey，altKey，which 什么意思-->6 <...
2017-03-03 15:25:00
272
转载 理解Js的parseInt(转)
parseInt() 方法首先查看位置 0 处的字符，判断它是否是个有效数字；如果不是，该方法将返回 NaN，不再继续执行其他操作。但如果该字符是有效数字，该方法将查看位置 1 处的字符，进行同样的测试。这一过程将持续到发现非有效数字的字符为止，此时 parseInt() 将把该字符之前的字符串转换成数字。一、语法parseInt(string,radix)...
2017-01-23 16:51:00
233
转载 css选择器
今天整理一下css的选择器，灵活使用css选择器可以减少不少无用工，如写不必要的js代码。很多时候可以用css做到的就尽量不用用js，原因：1、css代码速度肯定是js快2、js个人觉得要考虑的逻辑情况会比较多。3、出bug的可能性也少很多，出的都是兼容问题。我觉得实用(别的貌似不实用就不介绍)，css选择器可以分为1、最常用id、class、'*'(通配符...
2017-01-22 17:23:00
167
转载 自制轮子 canvas tree
这是树的效果这个树拥有的功能有1、小地图显示2、小地图点击快速定位3、点击加减显示根节点4、基本的数显示5、节点拖拽6、点击头像跳转到相关页面7、使用直角线和直线选择8、画布自适应9、滚动条自动居中具体如何实现原理是通过点击画布的XY点来确定你进行了什么操作，点击了什么节点，改变数据，然后通过数据来重新渲染画布。其实使用canvas入...
2017-01-19 14:45:00
314
转载 2016年个人技术总结（前端）
自我总结参与项目备注:[☆-表示比较吊的项目,@-从头开始做,^-中间加入项目]神马生活(微信公众号商城)[^]神马学院[@]<!------跳槽线-------->大数据套件[☆][^]fable数据营销平台(加入新功能，交互)[^]fit问卷系统[@]fit投放系统[@]fit画像[^]理财通点击流[^]学到、用到技术j...
2017-01-06 10:47:00
231
转载 认真研究一下Gradients css3(无聊笔记)(原)
渐变（gradients）分为2种：线性渐变（Linear Gradients）- 向下/向上/向左/向右/对角方向径向渐变（Radial Gradients）- 由它们的中心定义红色框表示可重复的线性渐变语法background: linear-gradient(angle,color-stop1,color-stop2);ang...
2016-12-26 17:05:00
186
转载 将上传图片转成base64（转）
效果如下：<!DOCTYPE html> <html> <head> <meta charset="utf-8"><title>简单的html5 File测试 for pic2base64</title> <style> *{margin: 0; padding:0;}#result{ wid...
2016-12-21 17:25:00
234
转载 canvas流星月亮星星银河
这是页面的特效，首先月亮直接出现，然后星星和银河渐渐的出现（一闪一闪），最后流星划过，留下完美的句点。所有的动画都是通过帧来实现的。星星的代码分为2部分，首先是随机生成星星，然后是绘制星星，最后是星星的帧动画。随机生成星星代码： function newStar(num,width,height) { var stars = []; /// 恒星...
2016-12-21 14:56:00
348
转载 sass接触
第一句话就是棒棒的，我爱上了。看了真阿当的文章：《2016年前端技术观察》http://weibo.com/ttarticle/p/show?id=2309404052560540511123这篇文章，我做了一些取舍。文章鄙视了很多新的技术。有人支持有人反对。至少我看到的是2016年的技术前沿碰撞。于是我决定用一下sass，听了很久却从没用过，项目上也许用不着，不...
2016-12-15 11:20:00
192
转载 css 文字超出部分显示省略号(原)
单行超出省略号#word1{width: 100px; text-overflow: ellipsis; overflow: hidden;}几行超出省略号(只兼容webkit内核)#wordN{ width: 100px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp...
2016-11-30 11:35:00
189
转载 vue组件
分享出来让思路更成熟。首先组件是 Vue.js 最强大的功能之一。可以减少很多的工作量，提高工作效率。编写一个可复用性的组件，虽然官网上也有。。。。编写可复用性的vue组件具备一下的几个要求： 1，传递数据 2，传递事件 3，分发内容恕我还活在vue1.0的时代，现在2.0了，有不少改动。最重要的一点是Props 现在只能单项传递，不能在组件...
2016-11-28 17:25:00
116
转载 [半转]1px边框 移动端
半转的意思是借鉴参考，搬砖，加了一些自己的想法。在移动端里，因为存在2倍像素的问题，所以很多时候，移动端上的1px边框并不是意义上的。从下图红色框看到dpr：2.0 ，表示1px等于2倍的物理像素。网上找了一下，自己总结了一下。实现方法代码如下： 1 <!DOCTYPE html> 2 <html> 3 <head>...
2016-10-25 16:00:00
231
转载 关于如何在移动端收起键盘
遇到问题，再点击提交问卷时，手机的键盘没有收起来，该项目前端是用vue.js,手势是用vue-tap.js这样的效果貌似用户体验不好。这时候我就在网上搜，js控制手机键盘。。。。后来问了一下群的朋友。换了一下逻辑，首先键盘为何会弹出，因为点击了输入框，该输入框获得的焦点，于是键盘就弹出了。所以方法很简单，只要让该输入框失去焦点就行了。或者焦点转...
2016-10-12 10:44:00
690
转载 关于push数组，然后遍历数组遇到的坑，遍历显示函数
我偷了个懒将点击的东西push进一个arr里，然后遍历显示在上面。为啥子出现了上函数，什么鬼什么鬼。我检查很久都不晓得那里push进去的。一个小时后，我想想要不看看arr里面的结构吧！尼玛！为啥子将for(in)将原型方法也被遍历出来为啥子！尼玛！尼玛！这样的坑了我一个早上。。。。。解决办法1，使用for(var i = 0; i< arr.leng...
2016-09-23 14:40:00
1212
转载 文本框 textarea 动态显示行数（简单文本编辑器）
工作需求做一个文本编辑器简单的。右边输入文字，左边会显示相应的代码行。清空也会变为1.废话不多说上代码，自己理解。<style type="text/css">*{margin: 0; padding: 0;}html,body{height: 100%; margin: 0; padding: 0;font: 12px/1.5 tahoma, a...
2016-09-02 16:21:00
5407
转载 JavaScript的学习资料
https://developer.mozilla.org/zh-CN/docs/Web/JavaScripthttp://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000http://bonsaiden.github.io/JavaScript-Garden/zh/附...
2016-08-19 16:18:00
134
转载 js 数据类型 typeof的测试
1 var t1 = 1, 2 t2 = '1', 3 t3 = null, 4 t4 = NaN, 5 t5 = undefined, 6 t6 = function() {}, 7 t7 = true, 8 t8 = window, 9 t9 = document,10 ...
2016-08-18 10:52:00
137
转载 js cookie 数组 存读
自己研究了一下."Cookie里面只能放String类型"所以只能将arr的数据按照自己的约定转成string格式存进cookie。这里提示一下cookie是存在本地浏览器，session是服务器上的。将下列的数组存进cookie。1 var arr = [2 {'name':'joe'},3 {'name':'json'},4 ...
2016-07-22 11:17:00
426
转载 js 日期时间排序 数组
不多说直接show代码var timeArr=[ {'id':'A01','date':'2016-04-20 23:22:11'}, {'id':'A02','date':'2016-04-21 21:00:11'}, {'id':'A03','date':'2016-04-23 22:00:22'}, {'id':'A04','date':'2016-04-19 12...
2016-04-26 14:43:00
970
转载 移动端设置-----rem
对于现在不同尺寸的移动端屏幕，如果设置px来说实在有点影响用户体验，在小屏幕上太大，大屏幕上太小，不能实现响应式，所以就引进了rem的概念。rem是相对于根元素<html>在我的项目中就是用这样的一段js代码。<meta name="viewport" content="width=device-width, minimum-scale=1.0, max...
2016-02-24 11:04:00
153
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人