Archive for the “devs” category
动态载入/删除/更新外部 JavaScript/CSS (转)
by Bentz on January 20, 2010
传统加载外部JavaScript(*.js) 或者 Css(*.css)文件的方法是直接在标签里面进行添加:
这些文件用这种方式会同步加载到当前这个页面。
现在用动态的方式载入JavaScript/Css文件：
* 用 DOM createElement 方法创建一个 “script” 或者 ”link” 元素
* 设置相应的属性
* 使用 appendChild 方法, 把创建的元素插入到 head 标签的末尾
Zen Coding，透过css生成html
by Bentz on December 15, 2009
是不是觉得每天都敲同样的html代码有点麻木？ok，那就让css代我们生成优雅的代码和排版吧。让我们专心做其他更重要的事。
这就是Zen Coding所能做的。Zen Coding是一套快速编写html/css的工具，语法简单至极，实现的效果却有点惊人。利用css的书写规则来创建html，想像一下这有多便利吧，尤其是列表、小模块，这简直太棒了！
演示视频
简单的例子
|
1
|
div#content>h1+p
|
上面这一行的输出结果
|
1
2 3 4 |
<div id="content">
<h1></h1> <p></p> </div> |
更多语法
|
1
2 3 4 5 6 7 8 9 10 11 12 13 14 |
* E
Element name (div, |
…
Data URIs for CSS Images tests
by Bentz on December 15, 2009
用Data URIs来嵌入image的好处是能减少连接数，更少的连接数意味着更快的访问速度，和更低的服务器负载。
Rob Flaherty作了一个 Data URIs for css images的测试，将一个页面做成三个版本，分别对比他们的加载情况：
- 页面a:默认页面，1 css 1 js 31 images, 33 requests
- 页面b:css images作data URIs嵌入到css中，3 requests
- 页面c:css images作data URIs嵌入到另一个css中，放到页尾， 6 requests
结论：如预期般的，加载时间c<b<a，但是效果并不明显， 具体情况见这里
about lab
by Bentz on December 12, 2009
把平常捣鼓的一些小玩意放在了lab中，经常更新。
经验很大程度上就是代码量的堆砌，轮子造出来了稍微修剪下就能应用，在细节上没有必要纠缠太多，快速实现，频繁迭代，不要让时间拖累了自己。
js tips
by Bentz on December 7, 2009
超长换行的字符串
在换行的地方加\
|
1
2 3 4 5 6 7 |
var table = ‘<div class="table-form">\
<table>\ <tr>\ <td ><input type="button" value="关闭"></td>\ </tr>\ </table>\ </div>’; |
mootools bundle for textmate
by Bentz on November 3, 2009
工欲善其事，必先利其器。textmate不愧为最强大的编辑器，各式的bundle不仅好玩，新奇，更重要的是使用，用好bundle的感觉就像武功高手打出一整套组合拳般淋漓畅快，华丽但又拳拳到肉。
mootools的bundle是在git上搜到的，作者Thomas Aylott貌似就是mootools开发者之一。。。他的git中还有一个非常好用的js bundle，相对textmate自带的bundle来说多了挺多实用的功能。
安装:
|
1
2 |
cd ~/Library/Application\ Support/TextMate/Bundles
git clone git://github.com/subtleGradient/MooTools.tmBundle.git |
然后show bundle editor，成功安装～
使用时注意将语言切换到MooTools Javascript
