Web开发者助手 FeHelper

在iOS开发过程中，代码得用SVN管理起来，但是遇到这么个问题：Default@2x.png文件svn add不成功，总提示找不到这个文件。

结果查了查资料，原来得这样：

# 得在这个特殊文件名后再加一个@ 
svn add Default@2x.png@

自己Mark一下！

IE中可以直接使用CSS Filter实现，但非IE浏览器，却没有直接的提供类似方法。

好在CSS3出现了，可以通过filter:graysacle实现，但是目前仅支持chrome（18 dev+），

其他浏览器好像暂时没有支持的打算！

不过没关系，在中国，目前IE（6/7/8/9）+ Chrome（18 dev+）基本能覆盖了绝大部分浏览器（包括360、Maxthon、Sougou等）。

其余浏览器就算可以不用考虑支持，代码：

html { 
    filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); 
    -webkit-filter:grayscale(1.0);
}

写到这里，再顺便延伸一下-webkit-filter，严格意义上将，这个都不是CSS3的一部分，充其量算得上chrome浏览器的私有css，

其语法为：

-webkit-filter:effect(value);

effect可取下列值：

   grayscale           灰度，值为数值，x∈[0,1]

   sepia                  褐色，值为数值，x∈[0,1]

   saturate             饱和度，值为数值，默认是1，可以是小于1的小数，也可以大于1,x∈[0,+∞)

   hue-rotate         色相旋转，值为角度，x∈[0,360]，单位deg

   invert                  反色，值为数值，x∈[0,1]

   opacity               透明度，值为数值，x∈[0,1]

   brightness          亮度，值为数值，默认是1，可以小于1(变暗)，可以大于1(变亮)；

今天看到这么一则消息：jQuery 2.0将不再支持IE 6/7/8相关特性

这表示jQuery团队即将放弃不支持CSS3的IE 6/7/8，然而jQuery的用户那么多，届时定会掀起一阵“放弃IE低端版本浏览器”的热潮。对于前端开发人员来说，这必须是一件好事！

不过，也好理解，很早就看到新闻说，微软即将在2014年放弃对Windows XP的更新。而且现在IE6的占比逐步下滑，爽！

不过依值得担忧的是，由于现在各浏览器开发商在CSS3方面，都准备了各自独特的私有属性，比如chrome浏览器的-webkit-，firefox浏览器的-moz-，opera浏览器的-o-，IE浏览器中的-ms-等等。

随着各浏览器私有属性的增多，标准会偏离的更远，前端人员新的噩梦也许又来了！

在IE6下，对haslayout的处理，存在一个非常诡异的bug，直接导致浏览器崩溃！

代码片段1：

<a href="#">aaaa</a>

现象：鼠标滑过时不影响<a>标签的haslayout属性。正常。

代码片段2：

<style type="text/css">
    a:hover{zoom:1;}
</style>
    
<a href="#">aaaa</a>

现象：鼠标滑过时触发<a>标签的haslayout属性。正常。

代码片段3：

<a style="position:absolute;" href="#">aaaa</a>

现象：鼠标滑过时不影响<a>标签的haslayout属性。正常。

代码片段4：

<style type="text/css">
    a:hover{zoom:1;}
</style>
    
<a style="position:absolute;" href="#">aaaa</a>

现象：鼠标滑过时触发<a>标签的haslayout属性。正常。

代码片段5：

<a style="position:relative;" href="#">aaaa</a>

现象：鼠标滑过时不影响<a>标签的haslayout属性。正常。

代码片段6：

<style type="text/css">
    a:hover{zoom:1;}
</style>
    
<a style="position:relative;" href="#">aaaa</a>

现象：鼠标滑过时触发<a>标签的haslayout属性。浏览器崩溃。

这只是一个很小很小的知识点，在FeHelper中有使用到，在这边简单的mark一下。

$.ajax({
    type: 'HEAD', // 获取头信息，type=HEAD即可
    url : window.location.href,
    complete: function( xhr,data ){
        // 获取相关Http Response header
        var wpoInfo = {
            // 服务器端时间
            "date" : xhr.getResponseHeader('Date'),
            // 如果开启了gzip，会返回这个东西
            "contentEncoding" : xhr.getResponseHeader('Content-Encoding'),
            // keep-alive ？ close？
            "connection" : xhr.getResponseHeader('Connection'),
            // 响应长度
            "contentLength" : xhr.getResponseHeader('Content-Length'),
            // 服务器类型，apache？lighttpd？
            "server" : xhr.getResponseHeader('Server'),
            "vary" : xhr.getResponseHeader('Vary'),
            "transferEncoding" : xhr.getResponseHeader('Transfer-Encoding'),
            // text/html ? text/xml?
            "contentType" : xhr.getResponseHeader('Content-Type'),
            "cacheControl" : xhr.getResponseHeader('Cache-Control'),
            // 生命周期？
            "exprires" : xhr.getResponseHeader('Exprires'),
            "lastModified" : xhr.getResponseHeader('Last-Modified')
        };
        // 在这里，做想做的事。。。
    }
});