- 博客(66)
- 收藏
- 关注
RSS订阅原创 关于在苹果浏览器中new Date()函数兼容性问题
直接上代码var currentTime = '2019-08-28 06:30:30';document.write('result:'+new Date(currentTime));在谷歌浏览器中效果：在苹果浏览器中效果再看一个具体点的代码效果 var currentTime = '2019-08-28 06:30:30'; //获取当...
2019-08-29 11:37:46
1007
1
原创 style,script文件版本号处理
写代码的时候经常会遇到修改了样式文件和脚本文件后但是没有效果的问题，仔细查看页面dom结构的话会发现代码仍然是你修改之前的代码，这就是浏览器历史记录缓存的问题，碰到这种情况就必须强制刷新页面或者清除浏览器本地缓存。但是这样做是非常麻烦的，有时候要经常做这样的操作难免会感到繁琐。所以想着自己写哥函数来解决这个问题，当然你也可以用一些构建工具比如gulp之类的也是可以的。解决问题的主要思路就是...
2019-06-20 17:18:20
480
转载 从浏览器多进程到JS单线程，JS运行机制最全面的一次梳理
前言见解有限，如有描述不当之处，请帮忙及时指出，如有错误，会及时修正。----------超长文+多图预警，需要花费不少时间。----------如果看完本文后，还对进程线程傻傻分不清，不清楚浏览器多进程、浏览器内核多线程、JS单线程、JS运行机制的区别。那么请回复我，一定是我写的还不够清晰，我来改。。。----------正文开始----------最近发现有不少介绍JS单线...
2019-06-05 15:00:03
347
原创 ios上面input输入框键盘弹起出现的一些问题
ios上面当用户点击输入框的时候软键盘弹出来会把页面内容向上顶起来，当收起键盘的时候，页面内容并没有回到之前的位置，这样会造成页面上的一些元素点击不到，因为位置发生了变化解决办法：在input绑定失去焦点事件 //处理移动端ios键盘收起页面位置不重置问题 handleBlur (){ window.scroll(0, 0); }...
2019-05-21 13:45:34
2201
1
原创 解决a标签download属性无效问题
起初遇到这个问题是因为在QQ浏览器中，a链接无法下载浏览器插件(.crx文件)，既没有弹出下载窗口，在下载记录里面也找不到下载文件，后面就给a标签添加了这个download属性。download属性的作用是强制弹出下载窗口，属性值可以自定义，一般定义为要下载的文件名。了解更详细用法但是在之后又遇到了问题，网站协议由http改成了https协议，a链接的下载链接中忘记修改，所以下载窗口没有弹...
2019-05-21 12:01:50
15297
原创 网页中调起QQ聊天遇到的一些问题
2项目中要用到调用客服聊天的功能应该是非常常见的，用起来也很简单，只需要一句代码：<a href="http://wpa.qq.com/msgrd?v=3&uin=2240073***&site=qq&Menu=yes">发起聊天</a>但是我在用的过程中发现，两个问题：1.出现以下这种情况2.能直接弹出qq聊天界面，但是没有显示与...
2019-05-16 12:40:10
805
原创 js判断chrome和360极速浏览器和360安全浏览器
在做项目的时候有用到判断不同浏览器的这个需求，然后就是按部就班的根据window.navigator对象里面的user-agent属性来判断，如果你以为就这么简单的话那就错来。以下是我自己遇到的几个坑，在此记录以下1.360浏览器在不同域名访问的情况下user-agent是不一样的，比如说在https://hao.360.com/这个域名下，展示为从其他域名访问如下：通过上面两...
2019-04-30 13:14:00
10329
2
原创 jquery实现点击链接滚动到指定位置
效果图：点击左边导航，右边内容滚动到相对应区域代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><style> *{margi...
2019-04-29 14:58:22
738
原创 js实现文字墙效果
文字墙的原理就是对js随机函数的操作 Math.random().先看效果图：代码：引用了模板渲染插件artTemplate,想看效果的可以下载到本地替换我的路径或者引用cdn,artTemplate文档<!DOCTYPE html><html lang="en"><head> <meta charse...
2019-04-24 18:22:41
1306
原创 javascript类数组转数组
1：什么是类数组简单的说--具有数组的length属性，但是不具备数组的方法，如shift,unshift,splice,slice,concat,reverse,sort,forEach等2：使用场景 1：函数内部arguments对象 2：获取的dom对象，如$('ul li')3：测试arguments test(10,20,30...
2019-04-22 18:16:44
705
原创 网页弹出遮罩层时页面向右偏移出现抖动问题
网页中经常会用到遮罩层的情况，在出现遮罩层的时候页面会整体向右偏移一段距离，因此会出现页面抖动，用户体验不好。首先我们要思考为什么会出现这种现象：1：写遮罩层的时候我们一般会给它设置fixed定位2：为了不让遮罩层下面的内容可滚动，我们一般会把body设置为overflow:hidden;当遮罩层出现的时候，会把浏览器默认的17px宽度的滚动条给隐藏掉，这时候页面就会向右偏移17p...
2019-04-01 15:19:09
1574
原创 微信公众号编辑器图片上传后有白色背景
在微信公众号编辑器里面上传图片后发现有的图片会自动添加一个白色的背景，仔细研究了一下发现了一个规律，那些会自动添加白色背景的图片一般有以下两个条件：1：图片为透明背景2：图片比较大，至于多大算大，在网上查找了一下大于40kb则有白色背景根据这两个条件我去尝试了一下果不其然，以下图片为效果图图片未压缩124kb,出现白色背景图片压缩后34kb，图片显示正常...
2019-03-12 11:38:33
4887
原创 移动端垂直居中字体偏上解决方案
做项目的时候发现给盒子设置垂直居中，在PC端是没有问题的但是在移动端上面字体会有明显的偏上 ，设置的line-height和flex布局 align-item:center均无效，在网上找了很多方法最后总结为：在移动端有很多手机不支持line-height,会有自己默认的22px的行高，但是我没有去考究。我是通过以下设置解决的，亲测有效。padding随自己设定 ...
2019-02-15 10:25:01
3573
原创 vue项目打包过程中遇到的一些问题
一：项目打包后index.html无法访问的问题这个问题有三个坑需要注意的：1.config文件夹下面的index.js文件里面需要修改assetsPublicPath路径，需要在斜杠后面加上一个点号，2.注意要在build环境下修改，不要再dev环境下修改，否则本地会出现cannot Get问题，页面一片空白3.如果发现修改路径后页面还是一片空白，可能是你路由配置的问题，...
2019-01-03 10:02:06
739
原创 webstrom 2018-12-19激活方式
第一步：打开webstrom复制以下代码到active code里面去，注意先不要点击确定，等完成第二步后再点击确定按钮AWAC5NN6E4-eyJsaWNlbnNlSWQiOiJBV0FDNU5ONkU0IiwibGljZW5zZWVOYW1lIjoibGIgb2QiLCJhc3NpZ25lZU5hbWUiOiIiLCJhc3NpZ25lZUVtYWlsIjoiIiwibGljZW5zZV...
2018-12-19 09:50:14
411
原创 npm不是内部命令也不是外部可运用程序
在安装好nodejs之后发现每次执行npm命令的时候都会报错：npm不是内部命令也不是外部可运用程序如下：百度了很久了没有找到解决办法，最后通过https://blog.csdn.net/qq_41542894/article/details/80330108这篇文章才得以搞定具体办法就是修改一下电脑里面的高级环境变量的配置，找到系统变量里面的Comspec，然后删除它就可以了...
2018-10-31 16:01:08
1146
原创 artTemplate辅助函数详细讲解
昨天奈何一个朋友一直问我artTemplate的辅助函数怎么用，和他说了一大堆也是懵逼，索性自己再写一个专门关于辅助函数的用法，希望可以帮得到其他有需要的朋友！！！先展示下整体代码，和效果图，之后我会以图片+文字的方式帮助理解：注意artTemplate.js和zepto.js根据自己的路径来改<!DOCTYPE html><html lang="en">&l...
2018-08-10 09:34:54
1438
原创 flex布局 just-content:space-between，列表上下两排数量不一致的时候处理方法
我们在做项目的时候，经常会遇到列表数据展示的需求，如下图：看到这种需求就想到用flex布局方法会很方便：然而··········这样写的话并不会像第一张图片那样展示，第二排的三个数据会平分整个宽度， 思路：所有我采用的方法就是改变原始数据，添加占位容器即添加多余的li元素 我用的是vue，其他框架可以借鉴思维，这是处理原始数据的方法这是html数据的绑定...
2018-08-08 14:44:19
10872
转载 git常用命操作详解
1. 什么是Git？Git 是 Linux 发明者 Linus 开发的一款新时代的版本控制系统，那什么是版本控制系统呢？怎么理解？网上一大堆详细的介绍，但是大多枯燥乏味，对于新手也很难理解，这里我只举几个例子来帮助你们理解。熟悉编程的知道，我们在软件开发中源代码其实是最重要的，那么对源代码的管理变得异常重要：比如为了防止代码的丢失，肯定本地机器与远程服务器都要存放一份，而且还需要有一套...
2018-07-27 10:57:16
792
原创 nodejs api学习：fs.createWriteStream()
作用上一篇博客介绍了createReadSream()函数，用于读取一个可读的文件流，接下来介绍一个作用与之相反的函数：createWriteStream()，有读取操作就有写入操作，改函数的作用就是对文件流进行写入参数参数与createReadSream函数同样：/*@params:path指定文件的路径@params:options可选,是一个JS对象，可以指定一些选项...
2018-07-25 11:39:31
27949
1
原创 nodejs api学习：fs.createReadStreame()
作用这个api的作用是打开一个可读的文件流并且返回一个fs.ReadStream对象 参数/*createReadStream(path,option):该用来打开一个可读的文件流，它返回一个fs.ReadStream对象@params:path指定文件的路径@params:options可选,是一个JS对象，可以指定一些选项如：let option={ ...
2018-07-25 11:11:22
24726
1
原创 webstrom编写nodejs代码无提示功能的设置
在用webstrom编写nodejs代码的时候，里面的api都是没有提示的，这样写起代码来非常的难受像这样，我本意是想写fs.createReadStream的但是没有提示出来，这样就得自己一个个字母敲了，效率不高还容易写错，于是百度了下解决方法需要我们设置一下，以下先贴张未设置之前的代码图： 只要把这个复选框选中就ok了，是不是很简单呢，接下来测试一下之前的createRea...
2018-07-25 10:19:32
3280
3
原创 浅谈react生命周期
之前写过一篇关于用creat-react-app脚手架构建react项目的博客，也是出于总结一下自己学习react的过程并帮助自己能更好的理解这个框架。接下来我也会不间断的更新react的知识点，今天就先讲讲react的生命周期函数，老规矩，先盗用一张生命周期的流程图，新手估计会有点懵逼，但是在不断的写代码实践的过程中相信会慢慢的熟悉起来的。 接下来通过代码我会把所有的生命周期函...
2018-07-20 15:09:14
413
原创 es6学习：箭头函数
首先我们看箭头函数的写法与普通函数写法之间的区别： function test() { console.log('普通无参函数'); } function test1(name,age) { console.log('普通带参函数'); console.log(name,age); } //注意：没有参数的时候用括号表示 let testFun3...
2018-07-20 10:40:49
225
原创 es6学习：字符串模板
es6字符串模板新增功能：1：字符串拼接可支持换行2：支持插入变量和函数接下来我会写几个例子来展示一下与es5之间的区别es5写法：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title&l
2018-07-19 20:42:48
242
原创 es6学习：let与const
1：let用于定义变量即定义的值可以改变，const用于定于常量即定义的值不可以被改变 let i=1; i=2; console.log(i);//2 const j=2; j=3; console.log(j);//执行会报错 2：用var定义的变量可以重复声明，但是用let和const定义了的变量和常量都不能重复声明，否则会报错...
2018-07-19 18:31:26
228
原创 creat-react-app构建react项目并配置less，sass等样式
项目构建步骤：1.cd到你的项目要存放的位置，然后执行以下命令全局安装create-react-app脚手架npm install -g create-react-app执行成功结果显示C:\Users\Saiang>d:D:\>cd projectsD:\projects>npm install -g create-react-appC:\Users...
2018-07-19 11:36:23
4342
1
原创 vue学习总结六：keep-alive用法以及activated,deactivated生命周期的讲解
注意：项目讲解案例参照之前的博客，如有不理解的地方，请按vue学习总结顺序查看。如果从头到尾仔细阅读过我之前博客的朋友可能发现，我在讲vue生命周期的时候并没有详细的去讲activated以及deactivated这两个生命周期函数，在接下来的这篇博客中会为大家揭开它的神秘面试。我会把列表页好详情页的数据替换成动态请求的数据，而不是写死在data函数里面，当然因为没有接口，我只能通过本地的...
2018-07-16 18:07:37
68782
12
原创 vue学习总结五：vue-router懒加载
由于vue单页项目最后会通过webpack打包成一个js文件，如果项目很大的话，会造成首屏加载缓慢浪费用户的等待时间，因为页面多加载了一些其他的组件，这个时候我们可以通过路由懒加载的形式来解决这个问题，至于怎样衡量一个项目大不大，需要不需要懒加载，我是根据慕课网上面的老师讲的方法：如果最后打包的那个app.js文件超出1mb的话则需要懒加载，个人未深究其中缘由，希望有大佬可以详细的讲讲好了，说...
2018-07-16 17:30:51
389
原创 vue学习总结四：理解vue-router
我们知道vue项目都是单页面应用，只有一个index.html文件，但是页面之前的跳转是依赖什么呢，vue提供了一个vue-router插件帮助我们实现页面之间的相互跳转，接下来我会重新改造一下之前的那个yourprojectname项目，新建四个页面:主页---->列表页---->详情页---->个人中心页 来帮助大家简单的了解一下router用法首先我会清空项目中之前写的那...
2018-07-16 17:02:51
1237
1
原创 vue学习总结三：理解vue生命周期
盗用vue官网对于生命周期的流程图：说实话你直接拿着这张图给一个新手讲vue生命周是怎样怎样，balabala一大堆估计会把人整懵逼的，开始我也是看不懂这张流程图，要真正理解vue生命周期的话，个人觉得最好的方法就是写代码做测试，在每个钩子函数里面打印一个东西，执行以下就可以一幕了然的看到函数的执行顺序了vue生命周期函数主要有以下10个：beforeCreate:表示组件实例刚刚被创建，组件属性...
2018-07-16 14:25:34
805
2
原创 vue学习总结二：项目前期准备工作
当我们构建完项目之后不要急于开始写代码，一些准备工作还是必须要先完成的，比如：因为我们是做的移动端单页面的项目，会存在300ms的点击延迟问题，改怎么解决？由于各游览器厂商对不同html标签的样式具有不同的初始化定义，因此我们要做到游览器兼容性的话就必须要统一初始化一个样式文件。我们写vue项目用什么来写样式？css?直接写css的话感觉太麻烦了，因此我一般习惯用stylus来写vue项目，当然用...
2018-07-16 11:04:31
1139
原创 vue学习总结一：vue-cli构建项目
vue 项目官网推荐新手直接用脚手架ovue-cli来构建项目，这样可以避免新手去自己手动配置那些复杂的webpack,因为用vue-cli的话几乎可以实现零配置。构建步骤大概如下：1.执行：npm install --global vue-cli执行成功如下：2.执行：其中'yourprojectname'为你的项目名称，可以自定义vue init webpack [yourprojec...
2018-07-16 09:46:30
473
原创 百度地图如何创建窗口以及自定义标注
我想要实现的功能：点击地图上的标注即弹出窗口 步骤：1.模拟数据：即要标注的数据，其中type字段为，根据不同的type值展示不同的标注图let data = [ { title:'测试标题1', content: "测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容", lat: "30.316369", lon: "...
2018-07-13 18:47:50
1033
原创 nodejs对文件操作的回调地狱解决方案
我们知道nodejs的fs模块，对文件的操作一般都是异步操作的，例如对文件的读取操作const fs = require('fs');fs.readFile('./a.txt',( error, data )=>{ if(error) throw error; console.log(data); console.log(data.toString());});...
2018-07-12 17:42:12
1187
原创 nodejs如何打断点调试程序
在node中打断点调试程序不像浏览器那样可直接在浏览器中某一行打断点，那么node该如何打断点调试程序呢？1.进入我们要执行的node文件 2.执行 node --inspect-brk index.js3.在谷歌浏览器中打开地址：chrome://inspect/#devices 显示页面如下4.点击上图中红框中的inspect按钮，进入程序调试界面：...
2018-07-10 17:23:40
9318
转载 webstrom实现本地项目上传到github
使用WebStorm上传本地项目到GitHub2017年04月19日 12:32:44阅读数：3756 在使用 WebStorm 上传本地项目到 GitHub 之前，先要做一些相关配置。 首先打开 WebStorm ，依次点击File -> Settings… 打开系统设置面板，在上面搜索 github 配置 GitHub 相关参数。 如下图所示，在...
2018-07-09 15:18:15
905
原创 vue中better-scroll中页面滚动无效的问题
因为在做项目的时候要用到滚动，所以引用了better-scroll这个插件，于是按照官网用法：<script> import BScroll from 'better-scroll' export default{ name: "CityList", mounted(){ this.scroll = new BScroll(this...
2018-06-17 21:12:31
3454
1
原创 css实现网页底部固定
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum
2018-06-08 14:14:14
963
原创 react实现底部固定菜单栏
在项目中经常会碰到这种需求，底部固定的菜单栏目，本来是想直接用react-router-dom组件的navLink来实现的，因为navLink组件有个属性 activeClassName设置选中样式，默认值为active,通过这个直接给选中的当前页面添加一个选中的样式即可，但是因为我想在里面加入一个图标，这就涉及到图标也要切换了，捣鼓了一下也不知道怎么用navLink来实现，最后就只能自己来写了。...
2018-06-01 09:43:14
8688
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人