woollllll-CSDN博客

原创 Less Extend语法使用的一点强调

Less中的Extend语法顾名思义实现类似继承的功能，强大且实用，但需要强调一点，使用Extend时，不能Extend含有变量的选择器名称，不然会无效！例子：没有任何问题，会编译为：如果使用变量呢？在Less中看着很优雅，没毛病，编译为：up-arrow 和 down-arrow哪去了？？？技能一通甩，全是未命中，有没有？

2018-01-05 11:55:40 1256

转载 js 空数组是true还是false

12var arr = new Array();// 或 var arr = []; 我们知道，初始化后，即使数组arr中没有元素，也是一个object。12typeof arr;// "object" 既然是object，用于判断条件时就会被转化为true12if(arr)console.log("it's true");// it's

2017-09-04 10:53:28 2418

原创 webpack构建性能优化

项目之前一直用webpack自带 UglifyJsPlugin 压缩，随着项目扩大，打包时间越来越长，于是着手优化缩短打包时间方案一替换为UglifyJsParallelPlugin插件，UglifyJsParallelPlugin支持多线程压缩，替换后打包时间缩短了3分之1方式1 安装 UglifyJsParallelPlugin插件 npm install --save-dev webp

2017-08-25 13:25:18 684

原创 react中css导致mocha运行报错(解决)

今天在集成mocha时遇到的问题，当react组件中包含引入css，less等样式文件后会报错SyntaxError: F:xxxx/src/source/stylesheets/radio.less: Unexpected token (1:0)> 1 | .dc-checkbox { | ^ 2 | position: relative; 3 | } 4 | .dc-c

2017-08-22 10:43:35 854

原创 zepto中$.each迭代器的实现

看了zepto源码，平时经常使用的$.each迭代器实现并不复杂，第一个参数传入对象或数组/类数组，第二个参数传入function，this指向当前某一个element[i]，数组/类数组通过下标遍历，对象通过属性遍历。//函数中不能用break，continue，用return true/false实现 each = function(elements, callback) {

2017-06-13 12:14:24 1880

原创 chrome插件--jsonview安装

安装jsonview插件可以更好的在浏览器查看json数据，首先在github中搜索jsonview,找一个chrome版本，比如https://github.com/jamiew/jsonview-chrome 下载插件解压到本地，打开chrome，菜单栏-更多工具-扩展程序点击右上角开发者模式，点击已解压的扩展程序，选择插件路径，刷新页面查看效果

2017-04-19 19:26:05 9545

原创 animate.css源码分析--bounce(弹跳效果)

animate.css是一个不错CSS3预设动画库,是很好的CSS3动画学习资源,下面来剖析下bounce效果的实现原理,在此基础上实现自己的CSS动画。先从animate.css把bounce效果单独移出来，暂不考虑针对不同的浏览器的支持,测试浏览器为chrome,看一下效果。html>head> title>bounce-sourcetitle> meta ch

2016-11-09 20:09:10 11597

原创 CSS3 三次贝塞尔曲线(cubic-bezier)

最近在看animation模块，其中animation-timing-function 和 transition-timing-function两个属性来控制动画速度分别提供了ease，liner，ease-in，ease-out，ease-in-out几个预设速度，还可以同过cubic-bezier来自定义速度，想要深入了解CSS3动画，实现随心所欲的动画效果，还是有必要理解下其中的原理。

2016-10-24 23:31:21 36980 2

原创 javascript中的几个假值

前两天面试遇到的问题，当时一脸懵逼，回来想想其实之前有看过，记录下以防忘记 JavaScript中有 6 个值为“假“,这六个值是false,null,undefined,0,”(空字符串),NaN除了这 6 个外，其它均为“真” ，包括对象、数组、正则、函数等。注意 ‘0’、’null’、’false’、{}，[]也都是真值。console.log( false == null )

2016-10-11 15:59:56 632

转载深入浅出JSONP--解决ajax跨域问题

作者：快乐乔巴出处：http://www.cnblogs.com/chopper/取不到数据！　　上周客户新买了服务器，原本在旧的服务器上放着客户的Web主页信息和一个后台程序(asp.net)，在客户的主页中有一个动态显示最新消息的处理，这个处理就是通过ajax异步从那个后台程序中取得的。由于又购买了新的服务器，客户想把web主页和那个后台程序分开来，后台程序被部署到了新的服务器上。不过这个项

2016-10-08 17:26:34 281

原创 jquery给动态dom绑定事件

如果需要给一个按钮绑定事件，通过jquery中一般是这样实现的。$("#id").click(function(){ console.log("hello world!");}); 但是在给动态生成的dom绑定事件的时候，无法绑定了。查询了jquery API，如果需要给还不存在的节点绑定事件，可以通过on方法解决这个问题，即事件委托。在jQuery 中，通过事件冒泡的特性

2016-07-07 11:24:07 3011

原创初识设计模式之策略模式（javascript描述）

先从一个应用场景说起，有一款游戏，我们会根据玩家的VIP等级提供不同经验加成，开始实现。 function calculateByRank( experience,vipRank ){ if(vipRank==='0'){ return experience; }else if(vipRank==='1'){ re

2016-07-05 13:52:18 378

原创前端优化之SEO技巧小谈

SEO (Search Engine Optimization) 中文大意为“搜索引擎优化”，所谓SEO是指通过对网站的结构，代码等优化以提高网站在百度，Google等搜索引擎中的排位，SEO不仅可以使网站在搜索引擎排位提示，获得更多的访问量，同时也是有助于提高网站代码质量，为用户带来更好的体验。若作为优秀的前端工程师，从网站的设计到建设再到运行的整个过程中都应贯穿SEO思想。大到网站结构，小

2015-12-20 11:25:34 1495

原创 JavaScript学习笔记（一）基本概念及基本数据类型

最近把前一阵学习的原生JavaScript知识又整理了下，前一阵看了《JavaScript面向对象编程指南》和《JavaScript高级程序设计》这两本书，写得很不错，适合初学者。下面总结下自己的学习笔记。

2015-12-05 13:24:43 549 1

woollllll