01 2017 档案
摘要：http://blog.csdn.net/zhouzhiande/article/details/52349344 http://blog.csdn.net/zhouzhiande/article/details/52349342 http://www.cnblogs.com/shmilysong/
阅读全文
摘要：一、碎碎念~前言 我们都用过jQuery的CSS()方法，其底层运作就应用了getComputedStyle以及getPropertyValue方法。 对于那些只想混口饭吃的人来讲，晓得CSS()如何使用就足够了。对于希望在JS道路上越走越远的来人说，简单了解一些JS库底层实现对自己的学习很有帮助。
阅读全文
摘要：目录 前言 单体模式 工厂模式 迭代器模式 装饰者模式 策略模式 外观模式 代理模式 中介者模式 观察者模式 前言 本文参考于《javascript模式》，因此会大量内容会和书中相同，手上有这本书的朋友可以直接看书。因为我的记忆习惯是抄书，所以我会先抄写下来再发到博客上。更新中。 单体模式 单体模式
阅读全文
摘要：一、set 1.基本用法 2.Set实例的属性 3.Set实例的方法 4.遍历操作 二、WeakSet 三、Map结构的目的和基本用法 实例的属性和操作方法 遍历方法 Map结构转为数组结构，比较快速的方法是结合使用扩展运算符（...）。 四、WeakMap WeakMap与Map在API上的区别主
阅读全文
摘要：本文的目的很简单，介绍Redux相关概念用法 及其在React项目中的基本使用 假设你会一些ES6、会一些React、有看过Redux相关的文章，这篇入门小文应该能帮助你理一下相关的知识 一般来说，推荐使用 ES6+React+Webpack 的开发模式，但Webpack需要配置一些东西，你可以先略
阅读全文
摘要：还是这个梗，收好冷。今天是一个css3模拟jq点击事件，因为我发现，css3中没有类似于，js的点击事件，那么，可不可以仿照 jq的效果，类似的做一个呢？主要用到,input里面的radio 单选按钮，然后后面跟一个a标签，让radio覆盖在a上，那为什么不直接 把 a放在radio上面呢？因为选择
阅读全文
摘要：1.简介 function命令与函数名之间有一个星号*； 函数体内部使用yield语句，定义遍历器的每个成员，即不同的内部状态。 总结： 调用Generator函数，返回一个部署了Iterator接口的遍历器对象，用来操作内部指针。 以后，每次调用遍历器对象的next方法，就会返回一个有着value
阅读全文
摘要：新的一年，我们有一系列新的东西要学习。尽管CSS有很多新的特性，但有三个特性令我最激动并进行学习。 1. Feature Queries（特性查询） 在这之前我写了一篇关于Feature Queries的文章the one CSS feature I really want。现在，它已经在这里了！目
阅读全文
摘要：最近刚做完一个移动端的项目，产品之无敌，过程之艰辛，我就不多说了，记录下在这个项目中遇到的问题，以防万一，虽然这些可能都是已经被N多前辈解决掉了的问题，也放在这里，算是为自己漫漫前端路铺了一颗小石子儿吧，也在文末留下自己未能解决的疑问，希望看到的朋友能解惑。 都知道做移动端的开发，在电脑上调试好了的
阅读全文
摘要：走进React React是一个构建用户界面的JavaScript库，是Facebook公司在2013年5月在github上开源的。其特点如下： 高效--React通过对DOM的模拟，最大程度地减少和DOM的交互。 JSX--它是对JavaScript的扩展，在React中可以不使用JSX，但是我们
阅读全文
摘要：godcss 移动端布局终极解决方案+神器 让移动端布局开发更加容易 http:/www.github.com/godcss/ 介绍 godcss不是一个库，也不是一个框架。它是一个移动端布局开发解决方案。使用godcss可以让移动端布局开发更容易。 使用动态的HTML根字体大小和动态的viewpo
阅读全文
摘要：摇一摇JS脚本逻辑：接下来是移动端JS脚本逻辑的实现，摇一摇的实现需借助html5新增的devicemotion事件，获取设备在位置和方向上的改变速度的相关信息，该事件的基本使用如下： devicemotion事件对象中有一个accelerationIncludingGravity属性，该属性包括：
阅读全文
摘要：在ECMAScript5（简称 ES5）中，有三种 for 循环，分别是： 简单for循环 for-in forEach 简单for循环 for-in forEach 在2015年6月份发布的ECMAScript6（简称 ES6）中，新增了一种循环，是： for-of for-of 下面我们就来看看
阅读全文
摘要：HTML DOM对象的属性和方法介绍 DOM 是 Document Object Model（文档对象模型）的缩写。 DOM（文档对象模型）是针对HTML和XML文档的一个API（应用程序编程接口），它允许程序和脚本动态地访问和更新文档的内容，结构和样式。 W3C DOM 标准被分为 3 个不同的部
阅读全文
摘要：大致介绍 JSON(JavaScript Object Notation JavaScript对象表示法),JSON是一种数据格式，不是一种编程语言。虽然它的名字中有JavaScript但是它却不属于JavaScript,就像Java和JavaScript的关系一样。而且，并不是只有JavaScri
阅读全文
摘要：一、方法引用来源和应用 此动态加载css方法 loadCss，剥离自Sea.js，并做了进一步的优化（优化代码后续会进行分析）。 因为公司项目需要用到懒加载来提高网站加载速度，所以将非首屏渲染必需的css文件进行动态加载操作。 二、优化后的完整代码 /* * @function 动态加载css文件
阅读全文
摘要：只关注括号内问题的同学，可直接跳转到蓝字部分。（标题起的有点大，其实只讨论一个问题） 两个在React组件上绑定的事件，产生冲突后，使用e.stopPropagation()，阻止冒泡，即可防止事件冲突，毫无问题。 今天是踩了个React事件的坑，需求可以简化为：点击框体以外的部分则隐藏框体。最直接
阅读全文
摘要：目录 一、jQuery 上下滚动抽奖效果 二、JQ地址级联划动选择器-中国省市区 三、JQ地址级联划动选择器-日期 四、JQ地址级联划动选择器-日期时间 五、jQuery + animation.css滑动解锁 六、jQuery.countdown jQuery倒计时插件 七、Simple Swit
阅读全文
摘要：市面上大多数关于Vue.js自定义指令的文章都在讲语法，很少讲实际的应用场景和用例，以致于即便明白了怎么写，也不知道怎么用。本文不讲语法，就讲自定义指令的用法。 自定义指令是用来操作DOM的。尽管Vue推崇数据驱动视图的理念，但并非所有情况都适合数据驱动。自定义指令就是一种有效的补充和扩展，不仅可用
阅读全文
摘要：很多同学一定都听过MVVM、组件、数据绑定之类的专业术语，而vue框架正是这样的一种框架。vue的作用是：通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。 第一部分：vue介绍与使用 话不多说，我们先来看一看最简单的vue是怎么使用的。实际上，我们只需要引入一个js文件即可（当然，这只
阅读全文
摘要：React是个技术栈，单单使用React很难构建复杂的Web应用程序，很多情况下我们需要引入其他相关的技术 React Router是React的路由库，保持相关页面部件与URL间的同步 下面就来简单介绍其基础使用，更全面的可参考 指南 1. 它看起来像是这样 在页面文件中 在外部脚本文件中 2.
阅读全文
摘要：一、JS动画与动作不一致解决: 1 2 3 if(!$( "#handle").is(":animated")){ //判断元素是否处于动画状态 } 二、停止事件冒泡 1 2 3 4 5 6 7 8 9 10 11 event.stopPropagation(); - 禁止JS报错 window.o
阅读全文
摘要：一、前言： 装饰者模式（Decorator Pattern）：在不改变原类和继承的情况下动态扩展对象功能，通过包装一个对象来实现一个新的具有原对象相同接口的新的对象。 装饰者模式的特点：1. 在不改变原对象的原本结构的情况下进行功能添加。2. 装饰对象和原对象具有相同的接口，可以使客户以与原对象相同
阅读全文
摘要：咳咳咳咳，感冒了感冒了，鼻塞，蓝瘦啊！嘴巴也开裂，哎，心疼自己。想到这是第三只唇膏了！只怪，放荡不倔爱自由， 行驶在冷风路上么，北风那个吹啊吹啊吹啊，好了，发神经发完了，接下来进入正题，严肃脸。（字数150应该凑够了。） js链式运动 代码如下 ： 1 2 3 4 5 6 7 8 9 10 11 1
阅读全文
摘要：接着上一篇ajax系列之用jQuery的ajax方法向服务器发出get和post请求写，这篇主要写如何利用ajax和FormData实现页面无刷新的文件上传效果，主要用到了jQuery的ajax()方法和XMLHttpRequest Level 2的FormData接口。关于FormData，大家可
阅读全文
摘要：在京东和淘宝等购买东西的时候，我们会经常预览左侧商品展示图片，把鼠标放到原图，右侧就会有个大图显示出细节。本文将带领大家写一个这样简单的功能！ 一、实现原理 当鼠标移入某一图片内部时，图片上部会出现一个类似于扫描的框，这个框内的图片部分，会以方大形式展示在右边，如下图： 从图中可以推测出一下几点：
阅读全文
摘要：linear-gradient linear-gradient是CSS3中新增的样式，主要用于颜色的渐变效果。MDN地址 linear-gradient在不同内核下使用方式不同，详细内容可参考w3cplus 实用栗子（在Chrome下） 缺角效果先看效果图 <div class="div1"> 这是
阅读全文
摘要：本博客只适合win7 系统 准备 必须要有 注意了！！！！ //注意所以路径均不支持中文 1.安装JSK （jsva环境） 默认安装位置 如果是32位操作系统 需要安装32bit版的JDK C:\Program Files\Java\jdk1.8.0_111 在终端中打命令查看 jdk版本号 2.
阅读全文
摘要：浏览器history对象 History 对象 history对象记录了用户曾经浏览过的页面(URL)，并可以实现浏览器前进与后退相似导航的功能。 注意:从窗口被打开的那一刻开始记录，每个浏览器窗口、每个标签页乃至每个框架，都有自己的history对象与特定的window对象关联。 语法： wind
阅读全文
摘要：阅读目录 History API回顾 History API与业务实践 回顾 阅读目录 History API回顾 History API与业务实践 回顾 移动端开发在某些场景中有着特殊需求，如为了提高用户体验和加快响应速度，常常在部分工程采用SPA架构。传统的单页应用基于url的hash值进行路由
阅读全文
摘要：网上正则表达式的教程够多了，但由于javascript的历史比较悠久，也比较古老，因此有许多特性是不支持的。我们先从最简单地说起，文章所演示的正则基本都是perl方式。 元字符 ( [ { \ ^ $ | ) ? * + . 预定义的特殊字符 字符类 简单类 原则上正则的一个字符对应一个字符，我们可
阅读全文
摘要：前言 由于公司计划有变，所以从H5页面改成去小程序写。所以在着手开发小程序。本人也不是什么前端高手，只是一名写后端偶尔写写前端的渣渣。请前端大神们勿喷。 一、什么是微信小程序？ 小程序在我的理解中只是高度封装的H5，封装了各种组件。根据官方的说法小程序运行不是在浏览器当中。姑且算是微信的插件吧。 二
阅读全文
摘要：利用闭包的强大威力，但从表面上看，它们似乎与回调无关。下面一起来研究其中最强大的一个：模块。 正如在这段代码中所看到的，这里并没有明显的闭包，只有两个私有数据变量something和another，以及doSomething() 和doAnother() 两个内部函数，它们的词法作用域（而这就是闭包
阅读全文
摘要：一.位置方法 ECMAScript5为数组实例添加了两个位置：indexOf（）和 lastIndexOf（）。这两个方法接收两个参数：要查找的项和（可选的）表示查找起点位置的索引（如在数组[7,8,9,1,0]中，“7”在第一个位置，它的索引是0。）。其中，indexOf（）方法从数组的开头（位置
阅读全文
摘要：先看一段代码 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 </head> 7 <body> 8 9 <script> 10 // 一个普通的数组
阅读全文
摘要：事件是 Web 应用中不可或缺的一个东西，用户在应用中执行一个操作的时候，比如鼠标单击时要触发执行一些事情，就可以给该事件绑定一个事件处理程序(event handler)。使用 jQuery 的 .on() 方法可以为选中的元素绑定任意的 DOM 事件，并添加事件处理程序。假设有如下 HTML 结
阅读全文
摘要：项目要求：将H5商城页面嵌套到公司微信公众号里 项目本身的开发跟移动端网页并无太多差异，只是这昨天遇到一个问题，说是棘手，到也简单。 用户下单后，在选择支付方式页面，有个倒计时的逻辑（从下单时开始计算，24小时后未支付，会有ws自动取消这个订单），js代码如下： 1 2 3 4 5 6 7 8 9
阅读全文
摘要：最近做了一个微信小程序开源项目库汇总，里面集合了OpenDigg 上的优质的微信小程序开源项目库，方便移动开发人员便捷的找到自己需要的项目工具等，感兴趣的可以到GitHub上给个star。 UI组件 weui-wxss ★852 - 同微信原生视觉体验一致的基础样式库 Wa-UI ★122 - 针对
阅读全文
摘要：我比较喜欢听音乐，特别是周末的时候，电脑开着百度随心听fm，随机播放歌曲，躺在床上享受。但碰到了一个烦人的事情，想切掉不喜欢的曲子，还得起床去操作电脑换歌。于是思考能不能用手机控制电脑切换歌曲，经过一段事件的思考，绝对采用html5+socket.io来实现这个功能。首先我把该功能的实现拆分为以下几
阅读全文
摘要：一、背景 window.onload方法只能存在一个，如果多次赋值给window.onload，则后者会覆盖前者。 二、浅谈jQuery.noConflict的实现方式 1）源代码 // 简化抽离出来源码 (function( window, undefined ) { var _jQuery =
阅读全文
摘要：目录 一、Bootstrap 1.1、添加引用 1.2、在页面中使用BootStrap 1.3、可视化布局 二、使用MongoDB创建数据库 2.1、启动MongoDB数据库 2.2、启动数据库GUI管理工具 2.3、创建数据库与集合 三、创建一个Express项目 四、Monk访问MongoDB数
阅读全文
摘要：自从Node.js出现以来，基于其的前端开发的工具框架也越来越多了，从Grunt到Gulp再到现在很火的WebPack，所有的这些新的东西的出现都极大的解放了我们在前端领域的开发，作为一个在前端领域里打滚了两年的文艺小码农来说，也有自己的一些体会，今天就来分享一下自己基于Gulp编写的一个比较丑陋的
阅读全文
摘要：我们平时在看一些选秀节目或一些歌唱类比赛节目时经常会看到在现场的大屏幕上会有观众的手机号在滚动来选出谁是幸运观众或谁中了什么奖项，这些手机号都是现场观众或场外观众在给选手投票时产生的，当主持人一声开始令下，大屏幕上的手机号就会快速随机滚动，当主持人一声停令下，大屏幕上会随机出现几个停止滚动的手机号，
阅读全文
摘要：在操作表格前后端交互式时，总会遇到将所要操作的行的信息传至后台进行数据库更新的操作，本文适用于标准的html页面和js库，并提出了三种操作方式根据实际情况进行选择 1.表格格式如图所示 2.表格代码如图所示 <c:forEach items="${users}" var="user"> <tr> <
阅读全文
摘要：React 专注于 view 层，组件化则是 React 的基础，也是其核心理念之一，一个完整的应用将由一个个独立的组件拼装而成。 截至目前 React 已经更新到 v15.4.2，由于 ES6 的普及和不同业务场景的影响，我们会发现目前主要有三种创建 React 组件的写法：1. ES5写法Rea
阅读全文
摘要：本篇和大家分享的是学习Vuejs的总结和调用webapi的一个小示例；快到年底了争取和大家多分享点东西，希望能对各位有所帮助；本章内容希望大家喜欢，也希望各位多多扫码支持和推荐谢谢： » Vuejs - 学习大杂烩 » WebApi + Vue.js 示例 下面一步一个脚印的来分享： » Vuejs
阅读全文
摘要：一、CSS与CSS3的区别 非常简单，CSS代表“Casading Style Sheets”，就是样式表，是一种替代并为网站添加样式的标记性语言。现在所使用的CSS基本是在1998年推出的CSS2的基础上发展而来的。10年前在internet开始普及的时候，就能够使用样式表对网页进行视觉效果的统一
阅读全文
摘要：前沿 写在文章的最前面 前沿 写在文章的最前面 这篇文章讲的是，我怎么去写一个 requirejs 。 去 github 上fork一下，顺便star~ requirejs，众所周知，是一个非常出名的js模块化工具，可以让你使用模块化的方式组织代码，并异步加载你所需要的部分。balabala 等等好
阅读全文
摘要：源于前段时候微信小程序最初火爆公测时段，把以前用 Canvas 实现的大转盘抽奖移植成微信小程序，无奈当时小程序对 Canvas 支持不够完善，只好降低用 CSS3 实现。虽然比不上 Canvas 绘图的绚丽，但也总算完成了一个抽奖的 Demo，详见：https://github.com/giveb
阅读全文
摘要：记录收集纯CSS层面实现的水平、垂直居中方法可用于块级、行内快、内联元素以及文字图片等。 水平或垂直居中 1.1 text-align1.2 margin1.3 line-height1.4 padding 水平与垂直同时居中2.1 挡板方式实现的水平垂直居中2.2 vertical-align2.
阅读全文
摘要：摇一摇遇到的问题 一、如何对摇晃效果进行反馈 刚开始的处理方式是，摇晃过程中不做任何处理，但后来反馈说这种效果不好，好像就没有摇动一样，如果声音也不响的话，就真的和什么都没发生一样。 后来想了想，加入摇晃过程动画，就像微信的摇一摇一样，摇晃过程中，会有上下移动的动画，这里加入了周围金币做跳跃运动的动
阅读全文
摘要：函数本身就是一段JavaScript代码，定义一次但可能被调用任意次。如果函数挂载在一个对象上，作为对象的一个属性，通常这种函数被称作对象的方法。用于初始化一个新创建的对象的函数被称作构造函数。 相对于其他面向对象语言，在JavaScript中的函数是特殊的，函数即是对象。JavaScript可以把
阅读全文
摘要：闭包是什么？ 闭包是内部函数可以访问外部函数的变量。它可以访问三个作用域：首先可以访问自己的作用域（也就是定义在大括号内的变量），它也能访问外部函数的变量，和它能访问全局变量。 内部函数不仅可以访问外部函数的变量，也能访问外部函数的参数（parameters）。但注意，它只能访问外部函数的 para
阅读全文
摘要：如果你在使用 Vue.js 和 Vue-Router 开发单页面应用。因为每个页面都是一个 Vue 组件，你需要从服务器端请求数据，然后再让 Vue 引擎来渲染到页面上。 例如，这里有个用户个人资料的页面。 user.vue 文件如下： 在动画过渡期间向服务器请求数据，如下： 这样，我们可以通过访问
阅读全文
摘要：写在前面 都知道，当我们读取一个对象的属性或方法的时候，会优先在这个对象上面找，如果在这个对象上找不到就会遍历他的原型，还没找到？ >原型的原型，又没找到？-->继续往上。。。 这便是原型链的功用。下面，我探讨了一下原型链的使用与扩展，依靠原型链实现继承。 至于什么是继承？ 我的理解是，一个对象可以
阅读全文
摘要：数组去重,是校招面试的必考知识点。简单的说,数组去重就是将一个数组中的相同的元素删除,只保留其中的一个。这里的相同其实是一个陷阱,有好多同学只认为值相等即为相同,而忽略类类型的判断。所以大家在进行数组去重的时候,一定要考虑周全。以下,就是笔者所实现的数组去重的几种简单的方式。 1、Set实现 第一种
阅读全文
摘要：相对组件来说，Vue 的插件开发受到的关注要少一点。但是插件的功能是十分强大的，能够完成许多 Vue 框架本身不具备的功能。 大家一般习惯直接调用现成的插件，比如官方推荐的 vue-router、vue-touch 等。 下面就看一下 Vue 的插件开发如何入门。 首先我们简单回顾一下 Vue.js
阅读全文
摘要：html如下: <div style="width:400px;height:300px;background:url(yuandan.jpg) no-repeatcenter;background-size:300px 200px;"> <canvas id="canvas" style="bor
阅读全文
摘要：具体文档和demo可以访问github:https://github.com/zhoushengmufc/iosselect 移动端浏览器对于select的展示样式是不一致的，ios下是类似原生的picker，安卓下各浏览器展示各异，我们需要一个picker组件来统一各端下各种浏览器的展示。 ios
阅读全文
摘要：dropzone.js是一个开源的JavaScript库，提供 AJAX 异步文件上传功能，支持拖拽文件、支持最大文件大小、支持设置文件类型、支持预览上传结果，不依赖jQuery库。 使用Dropzone 我们可以建立一个正式的上传form表单，并且给表单一个.dropzone的class。 <fo
阅读全文
摘要：目录 一、this 1.1、JavaScript中函数与方法的区分 1.2、指向全局对象 1.3、作为方法调用 1.4、在构造函数中的this 1.5、指定this指向的对象 1.6、作为事件时的this 1.7、小结 二、原型（prototype） 1.1、为什么需要prototype 1.2、t
阅读全文
摘要：background用法详解： 1、background-color 属性设置元素的背景颜色 可能的值 color_name 规定颜色值为颜色名称的背景颜色（比如 red） hex_number 规定颜色值为十六进制值的背景颜色（比如 #ff0000） rgb_number 规定颜色值为 rgb 代
阅读全文
摘要：由于同源策略的缘故，以往我们跨域请求，会使用诸如JSON-P（不安全）或者代理（设置代理和维护繁琐）的方式。而跨源资源共享（Cross-Origin Resource Sharing）是一个W3C规范，其建立在XMLHttpRequest对象之上，允许开发人员像使用同源请求一样的规则，在浏览器端发送
阅读全文
摘要：jQuery的ajax方法非常好用，这么好的东西，你想拥有一个属于自己的ajax么？接下来，我们来自己做一个简单的ajax吧。 实现功能 由于jq中的ajax方法是用了内置的deferred模块，是Promise模式的一种实现，而我们这里没有讲过，所以我们就不使用这一模式啦。 我们只定义一个ajax
阅读全文
摘要：Javascript中的this 下面列举一些简单的实例 总结一下this的一些用法： 1.方法中的this会指向当前执行该方法的对象 如： var name = "window" var Tom = { name:"Tom"; show:function(){alert(this.name)} }
阅读全文
摘要：今天为大家分享一下我自己制作的浏览器滚动条，我们知道用css来自定义滚动条也是挺好的方式，css虽然能够改变chrome浏览器的滚动条样式可以自定义，css也能够改变IE浏览器滚动条的颜色。但是css只能是改变IE浏览器的颜色，而且CSS不能做到改变火狐浏览器的样式和颜色。所以只能是通过JavaSc
阅读全文
摘要：Function.prototype.toString这个原型方法可以帮助你获得函数的源代码， 比如： 输出: 这个方法真是碉堡了…, 通过合适的正则, 我们可以从中提取出丰富的信息. 函数名 函数形参列表 函数源代码 这些信息提供了javascript意想不到的灵活性, 我们来看看野生的例子吧.
阅读全文
摘要：在做网页开发的时候，有时候希望给图片设置一个备选路径，即，当src属性对应的主路径加载失败的时候，图片可以马上切换到备选路径。这样，即使主路径失效了，显示备用路径也不会影响网页的正常体验。 注意到网页中一张图片加载失败会触发error事件，因此可以使用DOM模型中的load和error事件实现这一效
阅读全文
摘要：徐某某 一个半路出家的野生程序员 徐某某 一个半路出家的野生程序员 徐某某 一个半路出家的野生程序员 javascript中的this与函数讲解 前言 javascript中没有块级作用域（es6以前），javascript中作用域分为函数作用域和全局作用域。并且，大家可以认为全局作用域其实就是Wi
阅读全文
