分类 前端设计 下的文章

来段js

<!DOCTYPE html>
<html>
<head>
    <title>test</title>
</head>
<body>
    <iframe data="<p>test</p>" id="iframe"></iframe>
</body>
<script type="text/javascript">
    var iframe = document.getElementById('iframe');
    var html = iframe.getAttribute("data");
    var iwindow = iframe.contentWindow;
    var idocment = iwindow.document;

    // iwindow.onload = function() {
    //     ihead = idocment.head || idocment.getElementsByTagName('head')[0];
    //     ibody = idocment.body || idocment.getElementsByTagName('body')[0];
    //     var div=idocment.createElement("div");
    //     div.innerHTML = html;
    //     ibody.appendChild(div);
    // };

    var ihead = idocment.head;
    var ibody = idocment.body;
    if (!ihead) {
        iwindow.onload = function(e) {
            ihead = idocment.getElementsByTagName('head')[0];
            ibody = idocment.getElementsByTagName('body')[0];
            var div=idocment.createElement("div");
            div.innerHTML = html;
            ibody.appendChild(div);
        };
    } else {
        idocment.open();
        idocment.writeln(
            '<html><head><head><body>' + html + '<body></html>'
        );
        idocment.close();
//         var div=idocment.createElement("div");
//         div.innerHTML = html;
//         ibody.appendChild(div);
    }
</script>
</html>

yahoo军规

  1. 尽可能的减少 HTTP 请求数
  2. 使用CDN(内容分发网络)
  3. 添加Expire/Cache-Control头
  4. 启用Gzip压缩
  5. 将css放在页面最上面
  6. 将script放在页面最下面
  7. 避免在CSS中使用Expressions
  8. 减少DNS查询
  9. 压缩 JavaScript 和 CSS
  10. 移除重复的脚本
  11. 配置实体标签(ETag)
  12. 使 AJAX 缓存
  13. 把JavaScript和CSS都放到外部文件中

reset.css

/* reset */
html,body,h1,h2,h3,h4,h5,h6,div,dl,dt,dd,ul,ol,li,p,blockquote,pre,hr,figure,table,caption,th,td,form,fieldset,legend,input,button,textarea,menu{margin:0;padding:0;}
header,footer,section,article,aside,nav,hgroup,address,figure,figcaption,menu,details{display:block;}
table{border-collapse:collapse;border-spacing:0;}
caption,th{text-align:left;font-weight:normal;}
html,body,fieldset,img,iframe,abbr{border:0;}
i,cite,em,var,address,dfn{font-style:normal;}
[hidefocus],summary{outline:0;}
li{list-style:none;}
h1,h2,h3,h4,h5,h6,small{font-size:100%;}
sup,sub{font-size:83%;}
pre,code,kbd,samp{font-family:inherit;}
q:before,q:after{content:none;}
textarea{overflow:auto;resize:none;}
label,summary{cursor:default;}
a,button{cursor:pointer;}
h1,h2,h3,h4,h5,h6,em,strong,b{font-weight:bold;}
del,ins,u,s,a,a:hover{text-decoration:none;}
body,textarea,input,button,select,keygen,legend{font:12px/1.14 arial,\5b8b\4f53;color:#333;outline:0;}
body{background:#fff;}
a,a:hover{color:#333;}