vcxiaohan2-CSDN博客

原创 js去抖和节流函数详解

$(() =&amp;amp;amp;amp;amp;amp;amp;gt; { // 举例：window scroll事件 /* 如果一直滚动下去，在经过3s后一定会执行一次move函数(函数节流)，如果停止滚动，在经过1s后会执行一次move函数(函数去抖)，用来控制会频繁执行的函数，优化dom操作，防止浏览器执行过多，出现卡死现象 */ $(window).on('scroll', () =&amp;amp;amp;amp;am

2018-07-31 20:27:35 1903

原创 js函数柯里化的理解

对象扁平化应用场景node接收参数时，无法自动转换参数，如：’false’不能转为false

2018-07-25 15:13:10 3089

原创实现destructuringArray方法，达到如下效果

网上的阿里二面的一道笔试题，实现destructuringArray函数，具有如下功能：// destructuringArray( [1,[2,4],3], "[a,[b],c]" )// result// { a:1, b:2, c:3 }网上解法不一且没有注释，为新人易懂，在此提供个人认为思路比较巧妙的2种解法，详见注释：let a = f([1, [2, [4]], 3],...

2018-07-22 17:17:50 2036 1

原创自定义一个简单的前端模板引擎

123

2018-05-23 23:19:43 4137

原创 new Date()传参的浏览器兼容性

测试以下是在IE9的测试情况可以看到IE9不支持new Date('2018-1-2')，但是支持new Date('2018-01-02')和new Date('2018/1/2') 主流浏览器都支持由/分隔的日期格式需求假如有这样的需求，一个输入框，用户可以输入日期，但是我们需要让所有浏览器正常解析，我们可以通过下面的函数做一个转换：console.log(getIEFormat('2018-

2018-04-19 18:14:43 763

原创 Mockjs原理简析

前言有一个前后端分离的项目用到过Mockjs，后端提供了数据格式，前端通过模拟接口的返回数据，进行页面的渲染，有一段时间，百思不得其解，这个插件是怎么把ajax请求给拦下来的，网上搜索了一番，资料甚少，未果。后来有一天，不知道怎么的突然想到，如果把ajax方法请求改写了，在发送请求之前提供一个回调是不是能实现这个功能？思路准备环境从最方便的jquery入手，打算改写$.a...

2018-04-11 23:48:06 7646 3

原创 js将人民币小写金额转换为大写

人民币大写在线转换工具以下为es6写法，可以直接在控制栏粘贴运行/** * 将人民币小写金额转换为大写 * * @class RMB * 示例 let rmb = new RMB() console.log(rmb.transform(2114523.234))// 贰佰壹拾壹万肆仟伍佰贰拾叁元贰角叁分 */class RMB { constructor() {

2018-03-26 14:35:10 4203 1

原创 js自定义事件

自定义事件(简单版)let Event = { /* 绑定事件 Event.on('log', function(param1, param2) {// 绑定一个log事件，并接收param1和param2参数 console.log(1, param1, param2) }) */ on(event, cb) { if

2018-03-01 15:56:28 620 1

原创移动端Retina屏幕1px边框问题

起因设计师给出设计稿上明明是1px的边框在移动端retina屏上显示很粗(2倍屏上显示为2px，3倍屏上显示为3px)设备像素比注意安卓不支持小于1的像素，所以通过设置border-width=0.5px不适用安卓解决通过高度为1px的div，再通过scaleY缩小可以实现(不能做圆角，而且做4条边很麻烦，排除).border-line { he...

2017-12-19 10:37:02 763

原创如何让多个div横向排列而不换行

现象多个div排列在一行，包裹的框宽度不足时，那么会换行显示如图解决关键点在于white-space: nowrap;的使用效果代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-

2017-12-15 16:58:01 61321 8

原创 zepto.js使用注意点

(注：以下解决方案只考虑现代浏览器(IE>=IE9)和手机端)fadeIn显隐遮罩层问题重现zepto的fadeIn方法，在显示透明的遮罩层(如opacity: 0.5)时，会把该图层最终的opacity设置为1，这显然不符合我们的预期解决思路通过css3动画transition的方式来达到显隐的效果给遮罩层设置样式.mask { display: none; posit

2017-09-21 17:09:25 911

原创 js错误监控

即时错误概念：即未注意写出的错误捕获：使用try catch或者window.onerror资源加载错误概念：js、css、img 不存在的情况捕获：由于window的error事件不能冒泡，所以我们使用事件捕获window.addEventListener('error', (err) =&amp;gt; { console.log(err) (new Im...

2017-08-20 08:37:51 1651

原创 js递归示例

console.log(factorial(3))// 6// 阶乘function factorial(num) { if(num <= 1) { return 1 }else { return num*factorial(num-1) }}flatten({a: 1, b: {c: 2, d: {e: 3}}})// 遍历对象上的所

2017-08-19 22:29:22 440

原创 css使多个相互之间有间隔的元素两端对齐显示

场景重现电商网站经常会展示产品图片，假设每行展示4个，且每个和每个之间有20px的距离，如何使每行展示的产品看起来是居中显示效果列举失败效果成功效果代码示例&amp;lt;!DOCTYPE html&amp;gt;&amp;lt;html lang=&amp;quot;en&amp;quot;&amp;gt;&amp;lt;head&amp;gt; &

2017-08-19 11:30:54 8657 2

原创 jq判断一个元素是否在可视范围内

场景重现比如视频在页面中播放，当用户向下滚动页面时，假如视频元素不可见了，那么我们应该停止播放相似的场景还有图片懒加载简单思路$(() => { // 只要将当前元素相对于窗口的高度+当前元素自身的高度和窗口的滚动距离做对比即可(注意要根据情况而定，对比参照物不一定是窗口，还有可能是父级div) setInterval(() => { console.log($(

2017-08-19 10:08:43 3862

原创 js原生实现jquery方法offset()和position()

$(() => { console.log($('p').offset()) console.log($('p').position()) console.log(offset($('p')[0])) console.log(position($('p')[0])) // jquery offset原生实现 function offset(target)

2017-08-19 09:45:27 5011

原创 node全文检索研究

前言企业中应用比较广泛的是Lucene和Solr，但是需要使用JavaElasticsearch可以使用Node本文给出几种Node实现全文搜索应用的简单示例node相关实现方式text-search MongoDB 全文搜索教程mongoosejs/mongoose-text-search优点：mongdb内置，方便缺点：功能少，效果可能不太理想倒排索引 MongoDB优化之

2017-07-20 11:29:14 1958

原创 node权限控制模块node_acl的应用

前言一个应用必不可少的部分：登录认证(jaredhanson/passport)、权限控制(OptimalBits/node_acl)由于node_acl中文资料较少，本文给出一个完整的简单示例，便于初学者理解和学习最后有动态的效果图给出，更直观的展示node_acl的使用效果重点示例中的路由并未采用如：app.put('/blogs/:id', function(req, res, n

2017-07-18 10:23:34 7868 3

原创 node图片处理工具gm的使用：图片水印、图片验证码、图片裁剪示例

请在这里查看示例☞ gm示例安装GraphicsMagick和ImageMagick的区别 (出现错误1)GraphicsMagick是从ImageMagick中分离出来的，推荐下载ImageMagick加载GraphicsMagick(大小4.72 MB) var gm = require('gm')加载ImageMagick(大小23.8 MB) var gm = require('

2017-07-07 15:29:22 9436

原创构建Promise队列实现异步函数顺序执行

场景有a、b、c三个异步任务，要求必须先执行a，再执行b，最后执行c且下一次任务必须要拿到上一次任务执行的结果，才能做操作解决方法一(使用then链式操作)特点：可以满足需求，但是书写比较繁琐代码var a = function() { return new Promise(function(resolve, reject) { setTimeout(functio

2017-06-29 11:38:02 15911 4

原创 Mongoose学习笔记

重点记录基本操作 (详见 #a2)var Promise = require('bluebird')var mongoose = Promise.promisifyAll(require('mongoose'))// (详见 #b2)// 连接数据库mongoose.connect('127.0.0.1:27017/foobar')mongoose.Promise = Pro

2017-06-15 22:42:50 2288 7

原创 ES6学习笔记

Object对象方法{ // 用变量做对象的键 let a = 'c' let obj = { [a]: 'b' } console.log(obj)// {c: &quot;b&quot;}}{ let obj = {a: 1, b: 2} console.log(Object.keys(obj))// [&quot;a&quot;, &quot;b&quot;]

2017-03-28 15:31:14 462

原创 js的call和this指向系列

在我理解call主要有2层意思实现继承：继承属性和方法function Fun1(sex) { this.sex = sex, this.say = function() { console.log(this.sex); }}function Fun2(sex) { //this.sex = 'female';// #1 Fun1.call

2017-03-24 10:23:42 1304

原创 Webpack学习笔记

下载傻瓜版Webpack示例项目webpack-demopackage.json示例 { &amp;amp;quot;name&amp;amp;quot;: &amp;amp;quot;camera&amp;amp;quot;, &amp;amp;quot;version&amp;amp;quot;: &amp;amp;quot;1.0.0&amp;a

2017-03-11 18:07:38 806

原创 seajs教程集合

seajs 2.3.0 添加jquery对 Sea.js 进行配置 seajs.config

2017-02-24 16:38:47 489

原创科大讯飞实现“文字转语音”和“语音转文字”

请在这里查看示例 ☞ iat示例详细介绍这里整合了科大讯飞官方示例，去除一些不必要的元素，便于开发者理解和应用相关功能仅通过h5，无法实现完全兼容手机端各浏览器，所以不建议用于手机端了解更多详细信息，请点击SDK下载中心进行相关文档的下载参考示例讯飞开放平台demo示例

2017-02-21 20:45:00 21762 31

原创使用jquery的ajax方法提交FormData数据

html&gt;head&gt; title&gt;测试title&gt; meta charset=&quot;utf8&quot;&gt; script src=&quot;../js/jquery-1.11.3.min.js&quot;&gt;script&gt;head&gt;bo

2017-02-09 09:43:51 22785 3

原创 jquery实现酷炫的抽奖器效果

请在这里查看示例 ☞ award示例使用介绍可以自定义行、列数以及每次选中的个数点击初始化按钮，即可加载功能，点击开始抽奖进行第一次抽奖已抽过的用户不会再被抽到源码示例<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="wid

2017-01-16 13:11:09 3331

原创 csdn博客栏bug集合

在chrome中进入markdown编辑区报错 windows 7,笔记本,最新chrome浏览器

2017-01-08 10:58:35 403

原创精彩技术博客集合

控制台输出彩色样式一个很赞的网页背景效果 canvas-nest.js

2017-01-05 16:13:45 488

原创 jquery.validate-表单验证插件的使用示例

请在这里查看示例 ☞ validate示例示例包含验证错误时，显示红色错误提示自定义验证规则重置表单需要执行2句话源码示例<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initia

2017-01-04 12:43:59 608

原创 css解决ios端按钮和输入框自带圆角的问题

请在这里查看示例 ☞ borderRadius示例问题重现在ios端，我们不想使用按钮或输入框自带的圆角样式，改如何取消呢？问题解决源码如下<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1,

2016-12-29 14:29:50 9320

原创 js解决软键盘遮挡输入框问题

请在这里查看示例 ☞ cover示例经验须知弹出软键盘时： ios端$(‘body’).scrollTop()会改变android端$(window).height()会改变拉起键盘不是一瞬间，而是有一个缓动过程问题重现ios端，经常会出现输入法遮挡输入框的问题(特别是那种有一个白色顶部的输入法，如：百度输入法)，如图：问题解决我们只需要在输入框聚焦之后，开启一个定时器，执行$(‘b

2016-12-29 12:48:57 16686 2

原创 node模版引擎Jade学习笔记

学习教程带你学习Jade模板引擎注意事项如果想直接运行.jade文件，需要全局安装 jade -> npm install jade –save-devjade index.jade -P -w -O index.json 以上命令的意思是：将index.jade文件编译成-P(格式化)、-w(实时监控)、-O index.json(引入index.json文件数据)的html文件一定要使

2016-12-16 09:09:58 2722

原创手机端如何真正的解决页面缓存问题

问题重现当我们需要开发手机端页面的时候，不得不在真机中调试在微信中，可以通过微信提供的设置-通用-存储空间-清理微信(这是ios，android可能略不同)进行页面缓存的清理在App中，就比较麻烦了，因为App一般不会像微信考虑的那么周全，给你提供清理页面缓存的途径问题解决像网上说的一些方法，经本人测试，都是无效的，如给head加meta标签：meta http-eq

2016-11-29 16:02:42 22670 1

原创 jquery深度拷贝extend方法封装

应用场景最近在搞微信小程序，这里面直接引入jquery的话会报错，但是项目用到了jq的extend方法，在这里抽离出这个函数，可以引入直接应用抽离源码var class2type = {};var toString = class2type.toString;var hasOwn = class2type.hasOwnProperty;var support = {};function ext

2016-11-27 18:31:59 2345

原创如何防止用户不小心多次点击按钮导致多次提交

产生原因如果网速慢的情况下，用户点击按钮提交后，如果接口还没有返回数据的话，用户会不耐烦的再点击一次提交按钮解决方法最简单的解决方法就是，把所有的按钮都写成 button 元素，如果是 div 元素的话，disabled属性是失效的用户第一次点击按钮，将该按钮设成成禁用状态$('button').attr('disabled', 'disabled');这个时候，按钮的点击事件已经失效当后

2016-11-23 17:47:08 5044

原创 Node学习笔记

## 开发环境Node `6.9.1`Express `4.15.3`Mongoose `4.10.5`Window `10`## 要点整理### 全局安装npm包目录(如：cnpm install xxx -g)* C:\Users\Think\AppData\Roaming\npm\node_modules(本人电脑)### Node 版本切换* 安装过n和nvmw，出现过各种各样的问题，都没有

2016-11-10 21:58:23 2226

原创 fastclick.js - 解决移动端 click 事件响应慢和点透问题

请在这里查看示例 ☞ fastclick示例建议只要在手机端的 h5页面，涉及到 click 事件时，都建议引入这个库相关链接移动端WEB开发，click,touch,tap事件浅析傻瓜看的fastClick说明书

2016-11-09 17:44:18 4485 1

原创查看使用 npm 安装插件的版本号

问题原因很多时候，我们记不清使用 npm 安装过的某个插件的版本了，这时候该怎么办呢？解决方法网上有人说去看 node_modules 文件夹的目录运行 npm list 命令运行 npm list -g –depth 1 命令或许以上方法可以让我们确认安装的某个插件的版本号，但是假如安装时的目录很乱(使用 cnpm 安装的话，不会按模块进行文件夹分类)，如下图： ...

2016-11-07 15:28:53 43358 5

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

空空如也

用gulp-sass编译scss是老是报错？

这个前端截屏功能是如何实现的？

在不同的手机上测试pc端页面，用什么工具？

ajax跨域请求，明明成功了，为什么获取不到数据？

请问前端怎么实现裁剪、传图片和传文件的功能？

浏览器切换到其它页面，过一分钟，再切回来，定时器就会出现紊乱？有人遇到过吗？

如何实现定时器控制自身的定时时间？

把a=aa&b=bb化成{a:"aa",b:"bb"}的方法？

extjs和backbone学习哪个比较好？

【急】iframe父操作子的dom元素失效？

css3 3D效果的一个问题？

sublime里面如何写css hack？

css hack \9\0会影响ie8

box-sizing:border-box的一个问题？

写js要不要面对对象？

chrome调试修改js怎么保存？

requirejs的data-main加载一次后，后面就更新不了？如何解决

关于上传图片预览的时候，图片尺寸不统一，你们都是给客户怎么样显示的呢?

请问手机端app页面要怎么测试它的兼容性？

酷狗音乐web版为什么不做成全屏自适应的呢？

npm包展示页的这个dependents是什么意思

taro怎么开启eslint？

mac上使用sourceTree提交代码不会走husky自定义的钩子

mac上使用sourceTree提交代码抱下面的错误

typescript装饰器之后，怎么让vscode识别新增加的方法

js原型式继承的一个问题？

element ui 如何支持表头是纵向的表格

css3 animation动画如何在鼠标移出之后不让动画立即停止？

express存入多个session会丢失的情况？

mongoose聚合的一个疑问

前端(浏览器)如何调用 rest api？

请问express的npm包errorhandler是干嘛用的

mongodb 都说索引能提高效率，这是为什么啊？

mongodb 一个字符串的问题

有一个问题，就是cmd中怎么换行啊？换行输入，但是不执行的

sass计算变量的一个问题

发布npm包的一个问题???

一个js传参赋值的问题？

es6 reset的一个疑问???

es6 let [a, b, c] = [1, 2, 3]为啥报错？