小谢的Blog — 认真生活 快乐工作 专注Web前后端开发|移动平台
今天由于部门唯一的美工Yang请假回家，下面这个页面的头部的切图任务就理所当然的就由我临时客串美工来完成。在做到导航按钮的时候，需要在鼠标移过的时候，背景会出现切换的效果。本来只要在a标签的:hover伪类中把背景图片换成另一张，而我觉得这样的切换太普通，没有什么挑战性。于是我决定试试自己实现类似LavaLamp的效果。
我在按钮下面加了个div作为背景，颜色是#cccccc，并设置透明度是20%。于是在chrome、Firefox和ie7+下，均能正常显示（ie8以下版本浏览器不能显示出圆角），而使用IETester模拟的IE6的下，却出现了不透明度的bug。尝试很多了方法，包括使用jQuery兼容的.css({‘opacity’:0.2})和ie6下的filter:alpha(opacity=20)，均是一样的ugly。。如下图：
最后尝试使用原版IE6打开，发现一切正常，哇哈哈。。如果没亲自遇到，实在不敢相信，原先我是迷信ietester的，现在看来只有春哥和曾哥，才值得你信赖。
在有些时候，比如你正在浏览我的博客http://x1989.com，并且你想通过浏览器的js console控制台对页面进行调试，而你又不愿放弃熟悉的jQuery语法而使用原生的javascript，这时候只要地址栏中输入以下代码：
javascript:void((function(){var e=document.createElement('script');e.setAttribute('src','http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js');document.body.appendChild(e);})())
以下是在各种浏览器中调出javascript console的快捷键：
IE : F12
Chrome & Opera:Ctrl+Shift+i
FireFox ： F12 (必须预装Firebug)
由此，你想到了什么……
事件的冒泡与捕获
如果不是动态绑定事件，事件委托是可能的。早期的web开发，浏览器供应商都会面临一个严肃的问题，就是当你点击网页中一个区域 什么元素是你实际想要触发的。这个问题伴随着页面元素交互的定义问题，点击任意一个元素的内部边界是模糊的。
点击一个按钮看看，你实际点击在一个按钮元素的内部，也是body元素内部，还是html元素的内部。
当这个问题出现的时候，有两个主要的浏览器：Netscape和IE。他们各自决定以不同的方式解决这个问题。网景公司定义的方法称为事件捕捉，一旦事件触发最先影响到DOM树最顶层对象（document），然后一直影响到事件源。因此，在这个例子中，单击事件的事件捕获最早由document处理，然后在<HTML>元素，然后是<body>，最后是<button>元素。
在IE中处理方式正好相反。 IE团队定义了一个方法称为事件冒泡。事件冒泡说的是，事件源元素的事件应该第一个被触发，那么它的父元素应该接收事件，然后它的父元素的父元素，等等，直到最后document对象接收事件。虽然document没有一个独特的视觉表现从<html>分开，但仍然被认为是<html>的父元素，从而继续冒泡DOM结构顶端。前面的例子可以看<button>首先接收到事件，然后就到<body>，再后到<html>，最后到达document对象。
当定义DOM标准时，W3C组织显然发现了事件的捕获机制与冒泡机制的优点，因而在DOM 2事件制定中支持这两种机制。首先，document对象接收一个事件，然后在捕获期间找到最具体的事件影响的元素，一旦这个元素绑定这个事件，事件将以冒泡的形式返回到document对象。DOM addEventListener() 函数接受三个参数，分别是事件名、事件句柄、支持事件冒泡还是捕获机制布尔值，绝大部分的web开发者会把这个最后那个参数设置为false，以期在IE中能有attachEvent()函数一样功能。
通过一个附加属性来进行事件与事件句柄绑定（element.onclick = function(){}），事件将被自动作为冒泡机制来处理（这是为了向后兼容），几乎每一款浏览器除了IE（即便是IE8）都支持DOM 2事件处理捕获与冒泡机制，而IE仍然只支持冒泡。
在冒泡机制中使用事件委托
事件委托在关键在于使用冒泡处理最顶层元素（通常是document对象），并非所有的事件都会冒泡，但是但鼠标和键盘事件会，也是也我们感兴趣的事件。回顾早先的事例，你可以为document对象绑定一个click事件，然后判断事件源，根据事件源不同来执行不同函数。
document.onclick = function(event){
//IE doesn't pass in the event object
event = event || window.event;
//IE uses srcElement as the target
var target = event.target || event.srcElement;
switch(target.id){
case "help-btn":
openHelp();
break;
case "save-btn":
saveDocument();
break;
case "undo-btn":
undoChanges();
break;
//others?
}
};
使用事件委托，可以把众多的事件处理缩减到一个，当前所有click事件都被一个根据事件源不同进行不同操作的函数处理，你还可以以同样的方式创建mousedown, mouseup, mousemove, mouseover, mouseout, dblclick, keyup, keydown, keypress事件处理程序。还有一句忠告，mouseover、mouseout因为它们的特性决定了他们通过事件委托很难处理。
注：你也可以使用事件捕获机制来建立事件委托，但是它将不能在IE浏览器中运行。
好处：
1，更少的函数管理
2，使用更少内存
3，更少的DOM处理Javascript代码
4，改变DOM元素的innerHTML时不必担心事件绑定被删除
从传统的事件处理转移到事件委托改善了世界各地大型web应用的性能。这项目工作十分重要，YUI与JQuery 已经把事件委托提炼为核心接口。只要花很小的代价实现事件委托，但性能有十分明显的提升。当你把几十个事件处理转化为一个事件处理程序好处显尔益见。进行事件委托的尝试吧，或许你将再也不会使用传统的事件处理方式了。
原文地址http://hzjavaeyer.group.javaeye.com/group/blog/720926 （译）
要不…就over啦，会直接输出php源代码，discuz ecshop之类的程序都会出现这种状况，唯独只有我自己基于thinkphp开发的程序正常。。估计是tp出于兼容性考虑把模板中的短标签<? ?>处理成兼容的<?php ?>标签了，话说tp的开发者们真是经验丰富哈
作为学生的最后一个暑假正式宣告结束~在请假回家若干天之后回归校园生活。值得高兴的是，在公司的全职工作也顺利转为了兼职实习，要感谢张总的肯定和提携~新的生活又开始了，上午上课，下午上班——难道这就是所谓的半工半读？好吧，我也认了。
从下定决心到开始Android开发之旅至此，前后算是有一周的时间了吧。越来越发自内心的感叹，在Android这个框架下编程真是一种享受~Google的技术真不是盖的。固然Android的SDK有些微软WPF、Adobe Flex的影子，但Android开发平台上最强大的还要算是Google提供的各式各样的api。这种开发方式，姑且称之为Google Model，造福的还是最广大的开发者。
今天很奇怪，开机到登录界面，输入密码、回车，黑屏两三秒后，又退回到了登录界面，重试几次，亦是如此反复。
但如果输入错误密码，还会直接提示认证失败，输入正确密码就不会。这说明Ubuntu还是能识别到是正确密码的。
想起我昨天搭建Android开发环境时候，修改到了/etc/environment中的环境变量，估计是改错了。想进修复模式修改，未果。于是想个办法进了liveCD，输入
sudo gedit /media/XXXXXXXXXXXX/etc/environment #注：XXXXXXXXXXXX表示你文件系统所在的路径名，可以进文件管理器看到），然后把你加上的地方删掉，保存、重启，就顺利进入系统了
可是这样就没办法在终端里使用adb(Android Debug Bridge)了，我们可以用其他的方法：
cd ~
sudo gedit export PATH=${PATH}:/home/xhowhy/android-sdk-linux_86/tools #后面的路径记得换成你的sdk tools所在路径
近期评论