最新版本的Lazy Load并不能替代你的网页。即便你使用JavaScript移除了图片的src属性，有些现代的浏览器仍然会加载图片。现在你必须修改你的html代码，使用占位图片作为img标签的src属性。真实的图片地址应该存储在data-original属性中。
<img data-original="img/example.jpg" src="img/grey.gif">
好处是现在你可以把你所有的JavaScript脚本放在页面的底部。如果你想支持没有启用JavaScript的浏览器，你必须在<noscript>标签内包含原始图像。阅读下面的文档获取更多信息。
Lazy Load 是用JavaScript编写的jQuery插件。它会延迟长页面中的图片加载。可视区域外的图片在用户滚动到他们之前不会加载。这与图片预加载(image preloading)是截然相反的情况。
在包含很多大体积图片的长页面中使用Lazy Load，会使加快页面的载入速度。当可视区域的图片加载完成后，浏览器将会处于准备状态。在一些情况下，这也会帮助服务器降低负载。
Lazy Load 灵 » » »阅读更多
首先表明的是，我根本不适合养宠物。自从捡到那只可怜兮兮的猫咪之后的几天，更加证实了我不是那种特别爱宠物的人。也许有人跳起来反驳我，说我没耐心。对于养宠物这件事情上，我真的是缺少耐心，我无法长时间地专注于猫咪，甚至它喵喵的叫声都让我觉得不爽，总觉得它叫起来，我不理它，似乎亏欠了它什么。在情感上来说，我不能无视它的叫声的诉求而不顾。于是，很难的抉择出现在我面前，究竟是养还是不养。有比我适合它的人，肯定是选择不养了。予我来说，对于它的收养只能限于短时期，长时间来说，我无法做到尽职尽责，住所和食粮可以提供，而情感上感觉会有亏欠。
猫咪是一次午饭之后回来的路上捡到的，它趴在路旁，缩起的身子形成了一个团，对着我们喵喵地叫，手摸到它的身上，脑海中浮现的只能是皮包骨头，身上极少的肉，大约只有2.4公斤的样子，对于一只成年的猫来说，根本无法想象如此的瘦弱。折腾了一番之后，总算领回住处了。可惜，对于我来说，考验 » » »阅读更多
沉重冰冷的冬日一日胜似一日地寒冷，仿佛带了寂寞的色彩，幽然地夹杂些许的悲凉，凌厉地从面前扫过，疼痛如刀割。冷冽的空气包裹着裸露的手指，如同数以万计的小针深深地嵌入骨头里面，只感觉到麻木而不知疼痛。也许，是真正的冬天了吧！
无意中看到行人的背影，像一片撕掉的叶，在稀薄的空气中摇摆不定，缓慢地游移。或许，在别人的眼中，我一如陌生的行人一样形单影只，像某种幼小的怯弱的兽，坚毅踏实得走着脚下的路，孤独彷徨地嗅到前方未知的险境，看到无能为力的命运，只好畏缩于温暖的山洞的巢穴中，无语亦无泪。
就像歌中的某种意境，似乎一切都是忽然发生，如同冬日突兀明媚的阳光，沉重地打到双眸里，使神经陷入恍惚的状态。然而，那些都是真的，确切的，树依旧像往昔的冬季，枝叶剥除干净，苍白的树干上爬满枯竭的疤，触目惊心地让人感到无奈。又像极了记忆，残破地不忍回忆，，如同手持匕首，亲自划开结成疤的伤痕，重新看到血液的涌流。
秋和 » » »阅读更多
过去的一年中，少有写技术之外的文章，而至于技术文章也是少之又少，干巴巴的几篇文章，到了年末更加稀少，甚至于没有了写的勇气。其它的文章，很久不愿再碰，只是这文字也无法知道如何组合，对于我来说，曾经有过的那些记忆，那些还喜欢写文字的岁月也走得很远，或许，在这新的年中还能慢慢地恢复那些有过的。
2011年过去没有多久，这空气的温度冷了下来，南方的天气比家乡潮湿，更加地阴冷。在那旧的年踩着新的年的尾巴的时候，我记起了自己在打游戏，这也许没有什么意义，对那新旧交替的时间变得不再敏感，没有了厚厚的撕剩下一张的日历，只是冷冷的屏幕上显示的数字标志着旧的年过去了。
总想总结下过去的一年，但也觉得没什么好写的，自己的生活，写下变成了记忆，诉诸文字，然后忘记。今年本命年，小的时候一直不知本命年为何物，认为只有中年的人才会有，看电视时好奇那些人喜欢穿红色的衣服，打扮的像个跳梁的小丑。而如今我也进入了他们的那个看似神 » » »阅读更多
Arguments对象是在函数执行时期动态创建的,它是一个类似数组的对象，可通过索引获取成员，拥有length属性。
arguments.length 表示实参总数，与此对应的行参总数可通过funcName.length获得。
arguments.callee 是对函数本身的引用，在ES5中严格模式下禁止使用。参考callee 。
把arguments转换成数组[].slice.call(arguments, 0)。
function foo() {
var args = [].slice.call(arguments, 0);
console.log(args); // [1, 2, 3]
}
foo(1, 2, 3);
arguments对象是不能被delete的。
arguments与实参之间是引用关系。
实参是无法被delete的，而arguments的成员可以delete，但是delete之后，实参和arguments成员的引用关系也就丢失了。
function foo(x) {
delete arguments; // false
arguments[0] = 11; // arguments[0]: 11, x: 11
x = 22; // arguments[0]: 22, x: 22
delete arguments[0]; // delete 之后丢失引用
x = 33 » » »阅读更多
JS无法做到访问DOM之外的内容，也就无法做到拷贝字符串到系统剪贴板，这时候只能用Flash去实现，个人感觉别无他法。
Flash操作系统剪贴板，知识点有两处。
1 » System.setClipboard(str) 拷贝字符串到系统剪贴板
2 » ExternalInterface.call(func, param...) AS调用JS函数
下面是Flex代码
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="16" minHeight="16">
<fx:Script>
<![CDATA[
public function copyToClipboard():void {
var text:String = ExternalInterface.call('Copy.clipBoard');
var status:Boolean = false;
if (text) {
System.setClipboard(text);
status = true;
}
» » »阅读更多
额，关于Tab切换，网上代码一大堆。硬生地直接在HTML结构中嵌入事件代码，个人感觉实在不爽，习惯了jQuery插件的配置方式，即使原生的JS代码也应该写的优雅一些。
这个组件，HTML结构有些要求。基本的HTML结构如下。
<div id="tab-switch">
<ul class="tabs">
<li><a href="#">Tab1</a></li>
<li><a href="#">Tab2</a></li>
<li><a href="#">Tab3</a></li>
</ul>
<div class="panes">
<div>......</div>
<div>......</div>
<div>......</div>
</div>
</div>
tab-switch是传递到组件对象的参数，tabs为tabs外层容器的类名，panes则是tab点击对应显示内容的外容器的类名。类tabs、panes可以在配置中指定。
初始化Tab切换所需要的JS代码 » » »阅读更多
JS克隆节点可以使用cloneNode方法。如果克隆节点下所有的子节点，需要传递参数true，这样就能得到节点深度拷贝的一个副本。JS本身提供的这个方法并不像jQuery的clone方法可以深度克隆事件绑定函数。
克隆节点的分为三步，第一得到需要克隆节点的引用，第二调用改节点的cloneNode方法，第三把克隆的节点插入文档。
var node = document.getElementById('id');
node.cloneNode(true);
node.parentNode.appendChild(node);
克隆节点时，节点所有的属性都会被克隆，那么我们就会想，可不可以克隆节点的绑定事件。这个在IE浏览器里可以实现，所采用的事件绑定方式只能是attachEvent。
当我们要动态生成的相同的节点，是采用document.createElement效率高还是去克隆节点。在我的测试中，IE系列和Opera克隆节点会显得效率比较高。在这个IE横行的国内，还是采用克隆的方式比较好。我做了一个测试页，查看演示。
// 克隆节点的方式
var span = document.createE » » »阅读更多
不支持placeholder属性的浏览器用jQuery库模拟。
包裹文本框的外层容器加上.placeholder类，有效率地获取对应元素。
if (!('placeholder' in document.createElement('input'))) {
$('.placeholder').find('input[placeholder], textarea[placeholder]').each(function(k, v) {
var $obj = $(v),
val = $obj.val(),
placeholder = $obj.attr('placeholder');
if (val == '') {
$obj.val(placeholder);
}
$obj.focus(function() {
if ($obj.val() === placeholder) {
$obj.val('');
}
}).blur(function() {
val = $obj.val();
if (val == '' || val == placeholder) {
$obj.val(placeholder);
}
});
});
}
查看演示
阅读更多
PHP本身内置了解析DOM的类，但是用起来有些不爽，如同在前端写JS操作DOM，悲催无比。后端如果有类似jQuery语法接口的库，那操作起来DOM就会变得很容易。网络上有个库，语法类似jQuery，名字叫做PHP Simple HTML DOM Parser。
后端解析DOM，内容是字符串或者文本文件。
$html = file_get_html($filename); // 文件文件
$html = str_get_html($string); // 字符串
获取DOM节点元素。
// 获取li节点下的文本
foreach($html->find('ul li') as $li) {
$li->text();
}
// 获取节点的属性
$html->find('img')->getAttribute('src')
修改节点元素。
// 将img节点的data-img属性和src属性对换
foreach($html->find('.lazy_img') as $lazy_img) {
$data_img = $lazy_img->getAttribute('data-img');
$src = $lazy_img->getAttribute('src');
$img = $html->find('.lazy_img', $i);
$img->setAttribute('src', $data_img);
$img->set » » »阅读更多