随笔分类 - 经验总结
摘要：grunt介绍 前端不能承受之痛 1、这是我们的生活 文件压缩：YUI Compressor、Google Closure 文件合并：fiddler + qzmin 文件校验：jshint 雪碧图：cssGaga sass编译：sass/compass 文件打包：require + r...
阅读全文
摘要：yeoman是什么 yeoman主要包含了三个工具：yo、grunt、bower。我们先看下这三个工具分别是做什么的： yo：脚手架工具，主要作用是创建项目骨架（跟grunt-init有点像）。 grunt：构建工具，主要用来运行各种任务，比如文件压缩、合并、打包等。 bower：主要用来...
阅读全文
摘要：作为一名前端攻城狮，相信不少人已经养成了这样的习惯。当你进入一个网站，总会忍不住要打开控制台看下它是如何布局的，动画是如何实现的等。这也是前端开发者一个不错的的学习途径。 github大家应该也不陌生，作为开发人员的“社交网站”，上面聚集了众多了技术大牛，当然还有他们的作品。由于前端的特殊性，相对于...
阅读全文
摘要：问题：文章《如何在内网安装compass》被移出首页 今晚在博客园发表了文章《如何在内网安装compass》，大概一个多小时候被移出首页，博客园管理员邮件如下：（后面楼主一一做了回复） 013-08-21 22:06, 原发件人：博客园团队 博主您好！ 您的博文“如何在内网安装compass...
阅读全文
摘要：在可联网的情况下，安装compass是件很简单的事情，但内网工作的童鞋就纠结了，因为很多公司内部网络都不通外网，肿么办呢？可以采取本地安装的方式。 由于gem不像npm那么人性化，能够在下载compass的时候，把依赖的包也一起下载，所以得得借助另一神器bundler。 简要概括：在能访问外网的机器上，通过bundler下载compass及依赖包，拷贝到内网机器进行本地安装
阅读全文
摘要：背景：悠记得去年6月的某个周末，因为项目的遗留需求，一个人跑到公司加班。那是个安静的下午，倒上一杯咖啡，一个人面对着电脑静静地敲着代码。没有闪动的RTX，没有心急火燎的电话。没有干扰，就连编码似乎也是一件享受的事情。 很快需求就做完了，正打算收拾东西回去，看到柜子上已经蒙上薄薄一层灰尘的板子，想起自毕业后，将近一年没有碰过他了，心血来潮，就把之前打了个底稿的克劳德童鞋给翻了出来。 备注：左边是原稿，右边是临摹的低仿稿。
阅读全文
摘要：写在前面 jQuery.fn.text在jQuery是个使用频率比较高的接口，它的作用无非是设置/获取dom节点的内容文本，下文会通过几个简单的例子来说明.text()接口的使用，以及最后会对源码进行分析。这几个接口本身不复杂，理解了textContent属性基本就迎刃而解，妨碍理解的我觉得反而是j...
阅读全文
摘要：在前面一篇文章《【前端模板之路】一、重构的兄弟说：我才不想看你的代码！把HTML给我交出来！》中，我们举了一个人肉各种createElement的例子，那繁琐程度绝对是惨绝人寰。人生本就苦短，每天加班又占据了不少时间，这么折腾下去，还让人怎么活。面对这种场景，我们该怎么做。 无需复杂的构建工具，仅几个简单的工具函数，帮我们告别重复意义的劳动：让代码让我们写代码！
阅读全文
摘要：随着前端领域的发展和社会化分工的需要，继前端攻城湿之后，又一重要岗位横空出世——重构攻城湿！所谓的重构攻城湿，他们的一大特点之一，就是精通CSS配置文件的编写。。。 前端攻城湿跟重构攻城湿是一对好基友，你写逻辑来，我写样式。 重构的兄弟说：把你的HTML交出来！ 于是，我把之前的那段代码给他，就是这货... >>重构的兄弟：。。。谁要看你的代码，我要看HTML结构！！ >>我：。。。要命有一条～～要不你把createCard 调用一下？ >>重构的兄弟怒了：想试试千年杀？！! >>我：？？！！擦，别～～你骚等～～～ ...
阅读全文
摘要：文章还可在我的github上找到，排版更友好一点：grunt从入门到自定义项目模板 一.Grunt入门介绍 1. Grunt是神马 基于任务的命令行构建工具（针对JavaScript项目） 链接：http://gruntjs.com/ 2. 使用Grunt的理由 前端的工具算得上是五花八门，在介绍如...
阅读全文
摘要：JDK安装 JDK下载 自行选择合适的版本下载：http://www.oracle.com/technetwork/java/javase/downloads/index.html JDK安装 以jdk-7u17-windows-i586.exe为例，双击安装即可，安装地址可以自行选择，我选的是默认...
阅读全文
摘要：note：本文主要参考了Stoyan Stefanov的文章《When is a stylesheet really loaded?》 在之前的文章《CSS文件动态加载》中，我们提到了在动态加载CSS文件的时候，如何检测加载是否完成。注意，这里的加载完成包含了两种情况： 1）加载成功 2）加载失败 ...
阅读全文
摘要：跟小组里一自称小方方的卖萌90小青年聊天，IT男的坏习惯，聊着聊着就扯到技术上去了，小方方突然问:1、声明一个数值类型的变量我看到三种，区别在哪? 2.明明是个数字字面量，为毛平常我们可以直接在上面调用各种方法....我嘴角微微一笑：少年你还嫩了点，哪止三种，我知道的至少有五种！！ 笑着笑着嘴角开始抽搐，额角开始冒出了冷汗：至少有五种，没错，但是。。。区别在哪。。。 怀着老菜鸟特有的矜持和骄傲，我不屑地说：这都不知道，自己查资料去。。。转过身，开始翻ECMAS - 262（第五版）
阅读全文
摘要：我们通常会这样使用： parseInt('123abc'); //输出 123 var num = 123; num.toString(); //输出 '123' 那么，radix这个参数的作用是？神马场景下会用到？有什么注意事项？下文会简单讲解
阅读全文
摘要：经常用到的小工具函数，每次用到都重写一遍，有点浪费体力，于是决定分阶段整理下，需要用到的时候就直接拷过来用了～ 对于dom节点的className，常用操作不外乎增、删、查（改可以用增+删事先），由于代码比较简单，直接上源码+接口注释
阅读全文
摘要：目的很简单，主要回顾下javascript里面Array常用的一些属性以及方法，虽然经常使用，但其实一些细节没有注意到，总是等到用到的时候再去查有点浪费时间，因此总结了下加深印象
阅读全文
摘要：目的很简单，主要回顾下javascript里面String常用的一些属性以及方法，虽然经常使用，但其实一些细节没有注意到，总是等到用到的时候再去查有点浪费时间，因此总结了下加深印象
阅读全文
摘要：关于页面动态创建大段内联CSS样式，以及可能遇到的问题，已经有很多先烈们进行了总结，比如三生石兄的文章：怪异的IE - 2，这里不赘言，仅做备忘。 其实还有疑问：styleSheetNode.innerHTML = str 是否在除了IE之外的浏览器都支持 直接上demo以及代码： .red{c...
阅读全文
摘要：本文主要内容归纳如下： 一、离线存储的作用； 二、如何实现离线存储； 三、applicationCache对象，及属性、事件、接口 四、访问缓存应用，相应触发事件，及其对应状态； 五、如何更新离线缓存 六、demo演示：update后是否调用swapCache的区别； 七、写在后面 一、离线存储的作
阅读全文
摘要：群里某筒子问了下，如何判断一张图片已经完成，把想到的可能的情况整理了下 一、一般情况下 1）图片静态页面标签创建 2）图片通过脚本动态创建 1 var img = document.createElement('img');2 img.onload = function(){3 al...
阅读全文