web前端基础知识整理

标签：速度   listener   defer   页面   load   highlight   理解   含义   pen   

1.we标准的理解

(1)Web标准规范要求，书写标签必须闭合、标签小写、不乱嵌套（可提高搜索引擎搜索效率，SEO优化）。

(2)使用外链css和js脚本，从而达到结构与行为、结构与表现的分离，提高页面的渲染速度，能更快地显示页面的内容。

(3)样式与标签的分离，使结构与表现分离，更少的代码和组件， 从而降低维护成本、改版更方便 。

(4)不需要变动页面内容，便可提供打印版本而不需要复制内容，提高网站易用性 。

2.前端页面的三层结构及其作用

结构层(structural layer)由 HTML 或 XHTML 之类的标记语言负责创建，对网页内容的语义含义做出了描述。

表示层(presentation layer) 由 CSS 负责创建。 CSS 对“如何显示有关内容”的问题做出了回答。

行为层(behavior layer)负责回答“内容应该如何对事件做出反应”这一问题。这是 Javascript 语言和 DOM 主宰的领域。

3.JS延迟加载的方法

(1)将js文件的引入放到页面的底部

(2)使用setTimeout

<script type=”text/javascript” src=”" id=”mjs”></script> 
<script type=”text/javascript”> 
setTimeout(“document.getElementById(‘mjs‘).src=‘defer.js‘; “,3000);//延时3秒 
</script>

(3)Google帮助页面的推荐方案

<script type="text/javascript">
    function downloadJSAtOnload() {
        var element = document.createElement("script");
        element.src = "defer.js";
        document.body.appendChild(element);
    }
    if (window.addEventListener)
        window.addEventListener("load", downloadJSAtOnload, false);
    else if (window.attachEvent)
        window.attachEvent("onload", downloadJSAtOnload);
    else window.onload = downloadJSAtOnload;
</script>

web前端基础知识整理

标签：速度   listener   defer   页面   load   highlight   理解   含义   pen   

原文地址：http://www.cnblogs.com/hofe/p/6512409.html