本月前端 Tips:
7.1 - 7.2
84.【CSS】绝对定位元素盖住链接或添加某事件handle的元素后，那么该链接的默认行为（页面跳转）或元素事件将不会被触发。Firefox3.6+/Safari4+/Chrome支持一个称为pointer-events的css属性，使用该属性可以决定是否能穿透绝对定位元素去触发下面元素的某些行为。（https://developer.mozilla.org/en/CSS/pointer-events）
83.【JS】Number,Boolean,String,Undefined这几种基本类型混合比较时，会将其转换成数字再进行比较；基本类型与复合对象进行比较时，会先将复合对象转换成基本类型（依次调用valueOf与toString方法）再进行比较；undefined被当成基本类型，undefined转换成数字是NaN，因此undefined与除null之外的其它类型值进行比较时始终返回false(注意NaN==NaN返回false)；null被当成复合对象，由于null没有valueOf与toString方法，因此和除了undefined之外的其它类型值进行比较时始终返回false。（http://www.javaeye.com/topic/696802）
7.5 - 7.9
84.【CSS】IE6及IE7/8怪异模式下，绝度定位元素当指定了left及right，而width或者height为默认值auto，此时浏览器无法正确地计算出width或者height的值，应该尽量避免此种情况设定固定的宽高，如不能避免，可以通过js获取宽高进行设置。（Google）
85.【JS】在插入文档后，IE下input.type属性为只读，如果需要修改可以通过新建另一个input控制显隐来达到目的。
86.【HTML】media type(媒体类型)是css 2中的一个非常有用的属性，通过media type我们可以对不同的设备指定特定的样式，从而实现更丰富的界面。media query(媒体查询)是对media type的一种增强，是CSS 3的重要内容之一。（详情：http://www.qianduan.net/media-type-and-media-query.html）
87.【HTML】关于 Canvas 和 SVG 探讨的一篇文章：http://www.sitepoint.com/blogs/2010/07/06/canvas-vs-svg-how-to-choose/
88.【JS】"==" 比较两个对象会自动进行类型转换，例如比较 '12' == 12将返回 true；而 "===" 不进行任何转换必须完全相等 '12' === 12 将返回 false。
7.12 - 7.16
89.【JS】想在IE6,IE7中创建一个父页面元素，那么你必须使创建元素属于父页面。var dummy = parent.document.createElement("div"); 在Firefox,IE8中，它允许在一个文档中创建要追加到另一个文档的元素。所以在Firefox,IE8中，可以使用parent.document也可以使用document。（张军）
90.【JS】e.preventDefault()仅仅是阻止默认事件，而 return false; 同时阻止了事件冒泡，详情参阅：http://css-tricks.com/return-false-and-prevent-default/
91.【JS】在webkit排版引擎浏览器中，用脚本动态设置style后，即使removeAttribute('style');,也可以访问到style中的css属性值，而FF、IE、Opera下均不可获取。
例子：
obj.style.width='500px';
obj.removeAttribute('style');
console.log(obj.style.width);//webkit排版引擎下可以获取到值（熊松松）
92.【HTML】关于 Firefox 在怪异模式下的一些特性：http://www.javaeye.com/topic/709316
93.【CSS】在 IE6/7/8 怪异模式中，当使用一对引号将所有的字体家族名连同分割的逗号全部包含，浏览器会修复此定义错误，多余的引号会被忽略。比如：body{font-family: "Arial, Tahoma"}，IE6/7/8 怪异模式会修复此定义错误，而解析为：body{font-family: Arial, Tahoma}，所以默认的字体为 Arial，而其它浏览器或者标准模式下则会以之为错误而不解析，最终使用浏览器默认字体。（Google）
7.19 - 7.23
94.【JS】Array.prototype.sort的兼容以及相关知识：http://www.javaeye.com/topic/714688
95.【HTML】仅在Firefox中，table元素宽度属性百分比大于100%时，Firefox会按100%处理；如果是style中的CSS特性，则不会这么处理。建议给TABLE元素设置宽度的时候，不要使用width属性，而是使用CSS中的width特性。（Google）
96.【PHP】$_GET 和 $_POST 等用户提供的数据如果使用不当，如验证、过滤不全面，就很容易造成安全问题。通常情况下，我们会编写“一坨”正则来验证数据格式是否合法。详情请参阅：http://www.gracecode.com/archives/3029/ （明城）
97.【JS】focus() 方法可滚动文档以使 Anchor 对象或者表单元素的位置变为可见，因此在定位表单或者锚点时不需改变 hash 而通过 focus() 方法来实现。
98.【CSS】IE6及IE7/8怪异模式仅支持A元素的:hover及:active，IE7标准模式支持所有元素的:hover，但:active仍仅支持A元素，除IE8标准模式以外的IE均不支持:focus。（Google）
7.26 - 7.30
99.【JS】设置option元素中的文本时需要注意：用doc.createElement('option')创建的节点，IE是无法直接设置text来改变文本的。必须通过 option.appendChild(doc.createTextNode(txt));来实现。但是，一旦节点被插入到页面DOM后，就可以直接设置option.text了。（熊松松）
100.【JS】delete 操作符用来删除对象的属性或者数组元素，对于使用 var 来声明的变量，是不能删除的，这一点在所有浏览器里表现一致（注意：在 firebug 中可以删除），直接全局声明（未带 var）的变量可以删除，这一点在 IE 9 preview 中除外。详情可参阅：
https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Operators/Special_Operators/delete_Operator http://www.javaeye.com/topic/720816
101.【HTML】样式的解析规则是从右到左，比如 div p {},浏览器解析是先匹配到 p，再匹配到 div。（圆心）
102.【Flash】SWF 嵌入到网页中默认 wmode 为 window，意味着是在页面中以新窗口模式播放flash，不受HTML影响,永远在页面最顶端。（龙藏）
103.【CSS】IE6 下没有“干净”的空 div，必须显式地设置 line-height 为 0 方可。（法海）
使用 python 写的一个小工具，内嵌两个文件 html.py 和 html_parser.py，第一个是不依赖 HTMLParser 的，第二个是使用 HTMLParser 的，请尽量使用第二个版本，第一个还在完善中。目前复杂的 HTML 页面无法保证正常格式化，比如淘宝首页那种内嵌各种 script 的页面，无法正常格式化。内联的样式、脚本都保持原样，未进行任何格式化操作，下个版本会加入。
本地需要安装 python 2.5 或者 2.6 版本，3.0 或者 2.7 运行，九成会报错。win 下文件基本都抄自玉伯。
说明：
文件说明：
- 如果你使用的是 ubuntu 系统，只需要下载 html_parser.py 这个文件即可。
- 如果你使用的是 win 系统，则同时需要下载 format.cmd, install.cmd, install.inf, run.bat, uninstall.cmd 等文件
使用方法：
1.ubuntu:
运行： python html_parser.py test.html，生成test-order.html
运行： python html_parser.py test.html "w"，则直接覆盖源文件
运行： python html_parser.py test.html test2.html，则格式化后文件将存储在 test2.html 中
如果要在 ipython 中运行可以使用 ipython …，或者 python -i …，后边与前相同
2.win:
运行 install.cmd 安装到右键，然后找到一个 html 文件，右键选择 format html 即可在同目录生成 *-order.html 文件
压缩包下载地址：http://code.google.com/p/html-format/downloads/detail?name=html-format.zip&can=2&q=
Google Code: http://code.google.com/p/html-format/
github: http://github.com/nanzhi/Html-Format
比如，有一个表单，当聚焦其中某一个输入框时显示提交按钮，当失焦的时候，隐藏提交按钮，或者显隐其它操作，这里仅以最简单的为例，我必须承认这种交互的无聊，但是人在江湖身不由己啊。
首先想到的应该是使用 focus 和 blur 事件，但是问题在于就算按钮显示出来了，我也点不到啊，一点就失焦了。。。一些人会想到不用 blur 事件，给 document 绑定 onclick 事件，但是这会带来一些副作用：
- document 上绑的事件太多，累啊；
- 当用户使用 tab 键切换的时候不会触发；
- 当页面被以 iframe 形式嵌入页面的时候，点了输入框，然后点父页面的 document 并不会触发事件；
- …
回头来看，还是 blur 靠谱，但是如何克服问题呢，其实很简单，给 blur 事件添加一个延时，经过各种测试，Opera、Firefox、IE8 最佳时间为 120 ms，IE7、IE6 最佳时间为 130 ms，Chrome 表现怪异，所以综合起来，取 130 ms 比较靠谱。
Demo: http://www.12sui.cn/test/event/focus-blur-100726.html
昨晚去看了这部片子，蛮感人，蛮震撼的，推荐周末去看，工作日看影响情绪。强烈推荐一下，人啊，应该在能力所及范围内给这个社会一些回报和帮助。
这部片子不错，虽然没有嘻游记那样有高潮，但是不至于睡着，从头 high 到尾，周立波的表现灰常不错，竟然还有殷叶子。。。看的时候没看出来。。。太不起眼了，是老太太的小丫头，最后演员表的时候看到，想想 3 年前红楼梦中人的选秀里，印象很深的两个可爱小姑娘殷叶子和赵梦恬。。。已经好久没见到了。。。再想想新版红楼梦，哎，真是糟蹋殷叶子啊。。。
推荐一下，跟嘻游记一样，还是不错的，豆瓣二星。
上午去看了这个片子，不错，其实吧，跟名字没啥关系，就是一部片子，不过还是蛮好的，顶一下。
前一个小时可以略去不看了，精彩处从奥特曼打小怪兽开始，最后的一二十分钟是精彩之处，前一段可以让你看得睡着，后几分钟你绝对睡不了，high，灰常high，哈哈~
这卷其实主要写了四件事：
第一，郑国渠成。韩国疲秦计使嬴政大发雷霆，竟然下达了逐客令。事实证明，人在极其生气的时候做出的决定是不理智的，相当的不理智的。但是嬴政的难能可贵之处就在于知错就改，能听取别人的意见。一个人可以不优秀，但是不可以不知人、不听人、不容人。郑国渠成，反让韩国再次成为笑柄，机关算尽太聪明，反误了卿卿性命。
第二，灭韩。韩非子是个天才，同时也是个杯具，天生大道之才，何无天下之心哉？曾经，申不害变法，早于秦国的卫鞅变法，一度成为当时的强国，有劲韩之称。然而，很快就over了，韩国实行的是术制，每个人天天上班、生活都小心翼翼的，生怕被咔嚓了，整日生存在惶恐之中，杯具，这怎么能持久呢。后来复辟了，但是术这玩意儿却被韩国君臣玩弄的炉火纯青，各种耍阴谋，而最终走向了灭亡。事实证明，人啊，不能太阴了。
第三，灭赵。赵武灵王的时候赵国一下子成为一个强国，成为当时六国之中唯一可以和秦国相抗衡、也是第一个打败新秦军的国家。其实他跟之前的秦国采用的基本相同的办法，一方面示弱，一方面变法，这就是老子的弱者生存之道。然而杯具的是，后边的皇帝太扯淡了，本身的体制没有秦国那么的完善，只是求的了一时的强大，而最终还是走向了灭亡。有原则是多么重要的哇~
第四，灭燕。燕国，多nb啊，姬姓国家，老牌的诸侯国，整天就知道装b，结果装死了。一个人有才或者有势或者优秀的时候，如果装b，时间长了，就不用装了。
Everything is virtual.
本月前端 Tips:
6.1 - 6.4
64.【JS】IE下操作innerHTML，向里面插入的内容包含有<style>标签的，style标签不会被解析，可以通过内联或者外联样式去解决。（龙刚）
65.【CSS】对于类似 .a.b {} 这样的样式，ie6仅能识别.b，会忽略掉前边的 .a，使用这种方式就会带来一些问题，而且在重置时也比较费劲，一般不推荐过多的使用此类形式来定义样式。
66.【CSS】在作input与后边文字元素垂直居中的时候，一般做法是：input=>vertical-align:middle;在IE浏览器中均可实现垂直居中对齐，但是在火狐下不是太灵活，可以使用vertical-align:-num（num:代表合适的数值），来调整差距。（涵宇）
67.【浏览器】浏览器对于样式表的处理可分成两类。FF和Opera会先渲染，之后如果样式被改则刷新渲染；Chrome、IE和Safari等到样式表全好了后才渲染。(通常他们只延时渲染样式表之后的内容，但IE在某种情况下会延时渲染全部)（涵宇）
6.7 - 6.13
68.【CSS】IE6/7及IE8怪异模式中，text-align:center可以使块级元素也居中对齐。其他浏览器中，textalign:
center仅作用于行内内容上。IE怪异模式中，给块级元素设置margin-left:auto;margin-right:auto无法使其相对于其父容器居
中对齐。其他浏览器中则不存在此现象。（Google）
69.【JS】有时候需要获取到flash对象，因此给object添加了id，给embed添加了name，两者的值刚好相同。此时如果使用window[name]来获取flash对象，各浏览器的表现就不一致了：在Opera/Safar/Chrome获取到的是一个集合HTMLCollection，弹出其length是2，在Opera/Safari/chrome中分别取出第1,2个元素分别是object，embed元素。准确的获取flash对象可以通过以下方式：
function getFlashObj(name){
return document[name] || window[name];
}
（来源：http://www.javaeye.com/topic/684672）
70.【CSS】当A标签缺失href属性后，它相当于普通的标签，在IE6下，普通标签是不支持“:hover”伪类的。因此，对缺失href属性的A标签设置“:hover”伪类是无效的。（Google）
71.【CSS】w3c css21规范中指出：A:hover必须放置在A:link和A:visited之后，否则将隐藏A:hover内定义的相同规则。同理，A:active应在A:hover之后，否则A:active中的相同规则将被隐藏（L-V-H-A）。在IE7(S)/IE8(S)/Firefox(S)(Q)/Chrome(S)(Q)/Safari(S)(Q)下，A标签的伪类遵循w3c css21规范中的L-V-H-A顺序标准。而在IE6(S)(Q)/IE7(Q)/IE8(Q)下则不遵循。（注：Q：怪异模式，S：标准模式）（Google）
72.【JS】正则表达式中，g表示全局配，如果正则表达式中带有g，每次匹配后lastindex会更新一次，比如：var s = 'abac',re = /a/g; 初始值lastIndex为0，第一次匹配后，lastIndex变为1，第二次匹配后lastIndex变为3，第三次匹配没有匹配到，lastIndex则变为0，可以通过以下代码进行测试：
var s = 'abac',re = /a/g;
console.log(re.lastIndex);
console.log(re.test(s));
console.log(re.lastIndex);
console.log(re.test(s));
console.log(re.lastIndex);
console.log(re.test(s));
console.log(re.lastIndex);
另外，建议在使用test检测的时候不要带上全局配。（龙刚、空帷）
73.【CSS】在一些切图的活动页面，如果出现图片裂缝问题，就在全局样式里加一个 img { vertical-align:middle;}，即可解决。（龙刚）
74.【CSS】在IE8中，-ms-filter是filter的别名，两者的区别是前者的属性值必须被单引号或双引号包围，而后者则不是必须的，而在IE8之前的版本中，filter的属性值必须不被单引号或双引号包围。（http://www.ued163.com/?p=818）
6.17,6.21 - 6.25
75.【CSS】尽量不要在浮动元素上使用 clear 特性，避免发生一些奇怪的兼容性问题，比如：在IE6(S)(Q)/IE7(S)(Q)/IE8(Q)中，如果clear特性被设置在一个浮动的元素上时，该浮动元素可能会与其前边的浮动元素放置在同一行。。。等等~（Google）
76.【CSS】"Layout"是IE/Win的专有概念，它决定了元素如何对其内容进行定位和尺寸计算，与其他元素的关系和相互作用，以及对应用还有使用者的影响。"Layout"可以被某些CSS特性(property)不可逆的触发，而某些HTML元素本身就具有layout。（Google）
77.【CSS】在使用CSS来写一个三角形的时候，需要注意一点，当边框设置为transparent时ie6下会显示出一个灰底，所以，ie6下要设置成背景的颜色，但是对于渐变背景的话此方法就不再适用了，建议使用图片代替。
78.【JS】一篇关于计时器的文章：http://www.sitepoint.com/blogs/2010/06/23/creating-accurate-timers-in-javascript/
79.【HTML】IE中IFRAME元素有一个专有的allowtransparency属性，参见：http://msdn.microsoft.com/zhcn/library/ms533072(en-us,VS.85).aspx。当其值为“true”时，IFRAME元素可以透明。当没有allowtransparency属性或者allowtransparency属性值不为“true”时，IFRAME元素的背景色始终为“#FFFFFF”，并且设置其背景色也无效。当allowtransparency属性为“true”后，IFRAME元素的背景色随
即变为“transparent”，然后我们可以随意设置其背景色。（Google）
80.【CSS】IE6及IE(Q)中BODY元素的背景色不是CSS规定的transparent，而是#FFFFFF。这个#FFFFFF是由background-color:window得来，window属性为是Windows系统主题设定的“窗口背景色”，这个设置会影响很多程序的窗口背景色，而其他浏览器多不受此影响。（Google）
6.28 - 6.30
81.【JS】replace函数的第二个参数可以为字符串或者函数，当为函数的时候，它有 n+3 个参数，其中 n 为 () 的个数，第一个参数是匹配模式的字符串，中间的 n 个参数分别对应匹配到的各个 () ，第 n+2 个参数声明了匹配在 string 中出现的位置，最后一个参数是 string 自身。
82.【JS】通常情况下，当一个页面出现滚动条的时候，获取scrollTop方法在各个浏览器下有些差异。Chrome、Opera、Safari可以通过doc.body.scrollTop方式来获取，而IE、FF下得到的值是0，但可以通过doc.getElementsByTagName('html')[0].scrollTop来获取。简便的解决办法：
var s1=document.body.scrollTop,s2=document.getElementsByTagName('html')[0].scrollTop;//返回非0，即真实有效的值
return Math.max(s1,s2);（熊松松）
83.【JS】如果一个对象并存valueOf和toString方法，那么在数值运算中，优先调用valueOf，字符串运算中，优先调用toString。（涵宇，龙刚）
昨晚看了这部片子，超出我的预料了，本以为应该没有《80′s 后》好看，不过看完，发现，比那个好看多啦~
还是比较喜剧的，比较搞笑哈~那个小孩儿竟然盗用我的名言 — “我才12岁”，哈哈~感觉整个都还不错，算是有故事的，不过那里边的小孩儿有点早熟。。。最后打擂台虽然故事比较老套，但是时间控制的灰常好，并没有打多久，不像其它片子最后打擂台一打几十分钟。。。打的头昏脑胀的~
总体感觉很好，豆瓣四分。
