CSS3动画事件
摘要：
CSS3 的动画效果强大，在移动端使用广泛，动画执行开始和结束都可以使用JS来监听其事件。animationstartanimationend以下是一个示例 CSS3 动画事件 Test CSS3 SlideIn 通过添加动画事件，可以依次... 阅读全文
Snandy
If you cannot hear the sound of the genuine in you, you will all of your life spend your days on the ends of strings that somebody else pulls.
JavaScript中知而不全的this
摘要：
都说 JavaScript 是一种很灵活的语言，这其实也可以说它是一个混乱的语言。它把 函数式编程 和 面向对象编程 糅合一起，再加上 动态语言 特性，简直强大无比（其实是不能和C++比的，^_^ ）。这里的主题是 this ，不扯远了。this 本身原本很简单，总是指向类的当前实例，this 不能... 阅读全文
JavaScript中function的多义性
摘要：
JavaScript 中的 function 有多重意义。它可能是一个构造器（constructor），承担起对象模板的作用； 可能是对象的方法（method），负责向对象发送消息。还可能是函数，没错是函数，和对象没有任何关系独立存在的可以被调用的函数。由于语言设计者的妥协，在 JavaScript... 阅读全文
禁止用户选定文本: user-select
摘要：
双击文本 select，会被选定，如下但有时点击元素时不想要被选定的状态，有一个尚未成为标准的 CSS 属性： user-select，它有4 个值：text 可以选择文本element 可以选择文本，但选择范围受元素边界的约束。none 不可以选择文本。auto 如果该元素包含可编辑的文本（如输入... 阅读全文
jQuery 3.0 的变化
摘要：
时隔 3 个月，jQuery 团队终于发布了 3.0 Alpha 版本。有两个版本 jQuery compat 3.0 和 jQuery 3.0。 jQuery compat 3.0 对应之前的 1.x， 兼容更多的浏览器，对于IE支持到 8.0 版本 jQuery 3.0 对应之前的 2.x，关注 阅读全文
JavaScript中产生标识符方式的演变
摘要：
本文记录下JS中产生标示符方式的演变，从ES5到ES6，ES5及其之前是一种方式，只包含两种声明（var/function），ES6则增加了一些产生标识符的关键字，如 let、const、class。一、ES5时代varfunction我们知道 JS 不象其它语言 Java、Ruby等，它用来命名变... 阅读全文
JavaScript中变量提升是语言设计缺陷
摘要：
首先纠正下，文章标题里的 “变量提升” 名词是随大流叫法，“变量提升” 改为 “标识符提升” 更准确。因为变量一般指使用 var 声明的标识符，JS 里使用 function 声明的标识符也存在提升（Hoisting）。JS 存在变量提升，这个的设计其实是低劣的，或者是语言实现时的一个副作用。它允许... 阅读全文
ES6 Map/WeakMap
摘要：
JS的对象本身就是个键值结构，ES6为什么还需要加Map呢，它与普通的JS对象有何区别？一、Map1. Map构造器先看Map的简单用法// 字符串作为key， 和JS对象类似var map = new Map()// setmap.set('name', 'John')map.set('age',... 阅读全文
ES6 Set/WeakSet
摘要：
ES6里加入了一个新数据解构Set，和Java的Set一样，它里面不存放重复的元素。Set实现为一个类，使用时需要先new。var s1 = new Set()s1.add(1)s1.add(2)s1.add(3)s1.add(1)var s2 = new Set()s2.add('a')s2.ad... 阅读全文
ES6块级作用域及新变量声明（let）
摘要：
很多语言中都有块级作用域，但JS没有，它使用var声明变量，以function来划分作用域，大括号“{}” 却限定不了var的作用域。用var声明的变量具有变量提升（declaration hoisting）的效果。ES6里增加了一个let，可以在{}， if， for里声明。用法同var，但作用域... 阅读全文
Javascript parseFloat内部解析规则
摘要：
这是由小习发的一个问题引起的讨论，结束后大家各自加深了多parseFloat的理解。如下16进制数0x10使用parseFloat转成数字，结果为0。潜意识期望的结果是16。有人说脑残，16进制数为什么要用parseFloat，因为16进制不分int和float（那是10进制的事）。的确是这样，实际... 阅读全文
ES6新增值比较函数Object.is
摘要：
在这之前我们比较值使用两等号 “==” 或 三等号“===”， 三等号更加严格，只要比较两方类型不同立即返回false。另外，有且只有一个值不和自己相等，它是NaN现在ES6又加了一个Object.is，让比较运算的江湖更加混乱。多数情况下Object.is等价于“===”，如下1 === 1 //... 阅读全文
ES6函数剩余参数（Rest Parameters）
摘要：
我们知道JS函数内部有个arguments对象，可以拿到全部实参。现在ES6给我们带来了一个新的对象，可以拿到除开始参数外的参数，即剩余参数（废话好多 O(∩_∩)O~）。这个新的对象和arguments不一样，它是程序员自定义的一个普通标识符，只是需要在前面加上三个点：...function fu... 阅读全文
ES6函数默认参数（Default Parameters）
摘要：
语言更新时每一个新增的特性都是从千百万开发者需求里提取过来的，规范采用后能减少程序员的痛苦，带来便捷。我们经常会这么写function calc(x, y) { x = x || 0; y = y || 0; // to do with x, y // return x/y}... 阅读全文
Mac os下换行符导致发布到npm里的命令行模块不能使用问题
摘要：
学习node，弄一个命令行模块，发布到npm后，Windows安装后可以使用，但Mac 终端下则不行。对比grunt-cli搞了一夜，甚是郁闷，最后发现竟然是操作系统的换行符问题。npm install jdf -g 后，去安装目录 usr/local/lib/node_module/jdf/bin... 阅读全文
Mac OSX下卸载Nodejs
摘要：
有时手贱看到新版本就升级，升级后发现一堆模块不能用了，心情好慢慢调，但也有调不好的时候，只能卸载重装低版本的node了。我的机器环境如下1. Mac OSX 10.10.32. node为0.12.2卸载过程1. 拷贝如下代码放到一个sh文件中（如uninstall_node.sh）#!/bin/b... 阅读全文
ES6箭头函数（Arrow Functions）
摘要：
ES6可以使用“箭头”（=>）定义函数，注意是函数，不要使用这种方式定义类（构造器）。一、语法1.具有一个参数的简单函数var single = a => asingle('hello, world') // 'hello, world' 2.没有参数的需要用在箭头前加上小括号var log = ... 阅读全文
IE6-9不支持Textarea的maxlength属性
摘要：
给textarea标签添加一个maxlength=200，测试工程师提bug说IE9没起作用。后一测试，发现IE10一下的浏览器均不支持去w3看了下，该属性已经被收纳到HTML5，IE10+和其它现代浏览器均已支持。对于IE10以下浏览器，可以通过几个事件强制用户不能输入超过的字数相关：http:/... 阅读全文
日期相关的小函数汇总
摘要：
在写日历组件和旅行相关频道开发的过程中，很多需要地方需要和日期对象打交道。拿京东旅游首页来说， 左上角的搜索框就包含了许多日期相关的交互逻辑，它包含了机票，酒店，度假等，这些都含有出发日期，到达日期等。 里面还包含了一个日期组件，在用户选择完出发日期后，会自动把到达日期定位在出发日期的下一天。 又如 阅读全文
IE6-11使用location.href提交时的链接复制到firefox或chrome时出现乱码
摘要：
这是在开发国际机票查询页时碰到的一个问题，测试工程师在IE里执行查询操作，然后把查询的url赋值到firefox的地址栏，firefox打开后就变成乱码了。1. IE浏览器，选择出发地，出发日期等后点击下查询2. 跳转到查询页，复制下IE浏览器里的URL3. 拷贝到Firefox/Chrome浏览器... 阅读全文
表驱动法 - 巧妙利用数组返回中文星期
摘要：
Date对象有个getDay方法，它根据本地时间，返回一个具体日期中一周的第几天。返回值从0~6，分别对应周日~周六getDay0123456星期几周日周一周二周三周四周五周六用到日期相关的需求时需要将getDay返回的值转成星期几，即“这一天”是星期几？比如日历组件中选择日历后返回 “2014-1... 阅读全文
PlaceHolder的两种实现方式
摘要：
placeholder属性是HTML5中为input添加的。在input上提供一个占位符，文字形式展示输入字段预期值的提示信息（hint），该字段会在输入为空时显示。如目前浏览器的支持情况浏览器IE6/7/8/9IE10+FirefoxChromeSafari是否支持NOYESYESYESYES然而... 阅读全文
设置输入域(input/textarea)中文本光标的位置
摘要：
以前记录了一篇将光标定位于输入框最右侧的实现方式 ，实现光标定位在文本的最末。这种需求往往在修改现有的文本。有时可能还需要把光标定位在首位，或者中间某个位置，这就需要实现一个更通用的方法。这个方法setCursorPosition需要使用两个原生APIsetSelectionRangecreateT... 阅读全文
HTML属性的长度问题
摘要：
越来越多的同学喜欢把数据存放在html属性上，比如xxx一堆JSON数据放在data-info里。存放的属性值有长度限制吗？如果有最大长度是多少？分别从HTML4和HTML5的规范去查看。HTML43.2.2节介绍Attribute，里面没有提到长度的限制。SGMLHTML4来源于SGML，看看SG... 阅读全文
JavaScript选项卡/页签/Tab的实现
摘要：
选项卡，也称页签，英文用Tab(Module-Tabs)表示。Tab将不同的内容重叠放在一个布局块内，重叠的内容区里每次只有其中一个是可见的。Tab可以在相同的空间里展示更多的信息，它把相似的主题分为一类，用户更好理解。Tab的应用可以缩短页面屏长，降低信息的显示密度，同时又不牺牲信息量。在这种趋势... 阅读全文