Show Framework

当php  json_encode 如下的

$output = array(‘success’ => true, ‘data’ => ‘<p>test</p>’);

时候，

如果前端的js是用eval(‘(‘ + jsonStr + ‘)’);的方式，亦或window.JSON.parse  都会报错

原因在于php的json_encode 默认是不转义< > 这种标签的，

这时候使用json_encode($output, JSON_HEX_TAG) 来把输出的tag开始结束符号转移掉就不会出错了

<
会被转义成\u003C
>
会被转义成 \u003E
 

注意：这根htmlspecialchars两码事

问题是这样的，Extjs 3.3.1版本中，在定宽的form中compositefield的label显示，但是field不显示，我试了一下发现非定宽的form就显示的， 原因是非定宽的form中 compositefield的 element的其中一个position relative的div 是设置高度的，在定宽的form中这个高度是没有被设置的，这个position relative的div的子元素全部是position absolute 的，这样子这个元素就失去高度了，而恰恰这个div又有overflow hidden 而且他父元素也是 overflow hidden   

有个解决办法

Ext.getCmp(‘your_compositefield’).doLayout(); 

是否有其他重现的条件不清楚，遇到此问题可以如上解决

<div style=”position: absolute; left: 0; top: 0;”>

  <div style=”height: 24px;”>title</div>

    <div style=”width: 100px;”>body</div>

</div>

就这么简单的一段绝对定位的应用，ie6和 ie7 
中都有bug，而且bug表现还不一致

原因是  绝对定位
的父元素，直接后代
不能有任何 haslayout

这个bug在ie6中的表现是父元素自动撑满

在ie7中的表显示 有haslayout的子元素自动包裹

fuck ie6 & ie7 again

        function getIeCompatMode() {
            var engine = null;
            if (window.navigator.appName == “Microsoft Internet Explorer”) {
                if (document.documentMode) {
                    engine = document.documentMode;
                } else {
                    engine = 5;
                    if (document.compatMode) {
                        if (document.compatMode == “CSS1Compat”) {
                            engine = 7;
                        }
                    }
                }
            }
        }

结果是 5, 7, 8, 9 ，IE6的结果是7（这段代码是获取浏览器兼容性模式的，非判断浏览器）

http://necolas.github.com/normalize.css/

Normalize.css is a customisable CSS file that makes browsers render all elements more consistently and in line with modern standards. We researched the differences between default browser styles in order to precisely target only the styles that need normalizing.

Normalize.css是一份定制的css文件，它可以让浏览器使用一致的方式渲染所有元素并且符合标准。

可以把Normalize.css当作css reset使用，当然它和yui css reset等还是有一定区别，yui css reset是个强力的reset，而Normalize.css更注重一致性。

google code http://code.google.com/p/zen-coding/

#page>div.logo+ul#navigation>li*5>a

快速生成



<div id="page">
    <div class="logo"></div>
    <ul id="navigation">
        <li><a href=""></a></li>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
    </ul>
</div>

phpstorm中提供了zen coding 支持，其他IDE可以去google code上查看插件

1.利用IE6 不支持> 选择器(子选择器)

F { color: red; }

E > F { color: green; }

IE6 为红色 其他all绿色

2. 利用IE6 对!important的错误理解

color: green !important;

color: red;

IE6 为红色 其他all绿色

以上两种方式，在高级的IDE中，不会出现错误提示~所以还是比较漂亮的~(如果你的IDE在遇见 *color: red;的时候不能给错误提示，建议还是换换吧，推荐webstorm)

还是，能不要hack就不要hack啦

IE6 IE7 很可恨吧？？

<div>

    <input type=”checkbox” />

</div>

div { border: 1px solid black; }

input { margin: 0; padding: 0; }

在除了IE6 IE7的浏览器中 checkbox都是贴着div的左边框和上边框的，有个解决办法，就是给checkbox设置上高度和宽度 都为13px

input { margin: 0; padding: 0; height: 13px; width: 13px; }

真纠结啊，fuck IE6 IE7 again