分类 前端设计 下的文章

来段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;}

html中插入flash

<object id="player2" width="980" height="362"type="application/x-shockwave-flash" data="gallery.swf">
    <param value="transparent" name="wmode">
    <param value="always" name="allowScriptAccess">
    <param value="gallery.swf" name="movie">
    <param value="high" name="quality">
</object>

readonly和disable的区别

  Readonly和Disabled它们都能够做到使用户不能够更改表单域中的内容。但是它们之间有着微小的差别,总结如下:
  Readonly只针对input(text / password)和textarea有效,而disabled对于所有的表单元素都有效,但是表单元素在使用了disabled后,当我们将表单以POST或GET的方式提交的话,这个元素的值不会被传递出去,而readonly会将该值传递出去(readonly接受值更改可以回传,disable接受改但不回传数据)。

一般比较常用的情况是:
  在某个表单中为用户预填了某个唯一识别代码,不允许用户改动,但是在提交时需要传递该值,此时应该将它的属性设置为readonly 。经常遇到当用户正式提交了表单后需要等待管理员的信息验证,这就不允许用户再更改表单中的数据,而是只能够查看,由于disabled的作用元素范围大,所以此时应该使用disabled,但同时应该注意的是要将submit button也disabled掉,否则只要用户按了这个按钮,如果在数据库操作页面中没有做完整性检测的话,数据库中的值就会被清除。如果说在这种情况下用readonly来代替disabled的话,若表单中只有input(text / password)和textarea元素,那还是可以的,如果存在其他发元素,比如select,用户可以在重新改写值后按回车键进行提交(回车是默认的submit触发按键),我们常常在用户按了提交按钮后,利用javascript将提交按钮disabled掉,这样可以防止网络条件比较差的环境下,用户反复点提交按钮导致数据冗余地存入数据库。
  disabled和readonly这两个属性有一些共同之处,比如都设为true,则form属性将不能被编辑,往往在写js代码的时候容易混合使用这两个属性,其实他们之间是有一定区别的:
  如果一个输入项的disabled设为true,则该表单输入项不能获取焦点,用户的所有操作(鼠标点击和键盘输入等)对该输入项都无效,最重要的一点是当提交表单时,这个表单输入项将不会被提交。
  而readonly只是针对文本输入框这类可以输入文本的输入项,如果设为true,用户只是不能编辑对应的文本,但是仍然可以聚焦焦点,并且在提交表单的时候,该输入项会作为form的一项提交。