zoukankan      html  css  js  c++  java
  • (原)JavaScript高级程序设计(第3版)--学习笔记--02: 在HTML中使用JavaScritp--0002--标签的位置

    2.1.1 标签的位置

    传统做法,所有<script>元素都应该放在页面的<head>元素中,例如:

    <!DOCTYPE html>
    <html>
        <head>
            <title>Example HTML Page</title>
            <script type="text/javascript" src="example1.js"></script>
             <script type="text/javascript" src="example2.js"></script>
        </head>
        <body>
            <!-- 这里放内容 -->
        </body>
    </html>

    这样做的目的:把所有外部文件(包括 CSS 文件和 JavaScript 文件)的引用都放在相同的地方。

    问题:在文档<head>元素中包含所有 JavaScript 文件,意味着必须等到全部 JavaScript 代码都被下载、解析和执行完成后,才能开始呈现页面的内容(浏览器在遇到<body>标签才开始呈现内容)。对于需要很多 JavaScript 代码的页面来说,这会导致:浏览器在呈现页面时出现明显的延迟,而延迟期间的浏览器窗口:将是一片空白。

    为了避免这个问题,现代Web应用程序一般都把全部 JavaScript 引用放在<body>元素中页面内容的后面,如下:

    <!DOCTYPE html>
    <html>
        <head>
            <title>Example HTML Page</title>
        </head>
        <body>
            <!-- 这里放内容 -->
            <script type="text/javascript" src="example1.js"></script>
            <script type="text/javascript" src="example2.js"></script>
        </body>
    </html>

    这样,在解析包含的 JavaScript 代码之前,页面的内容将完全呈现在浏览器中。而用户也会因为浏览器窗口显示空白页面的时间缩短而感到打开页面的速度加快了。

  • 相关阅读:
    排序算法的实现
    图——广度优先遍历(邻接矩阵存储)
    最大子列和问题-4种解法
    PATB 1015. 德才论 (25)
    PATB 1018. 锤子剪刀布
    PATB 1019. 数字黑洞 (20)
    常用协议的默认端口号
    统一资源定位符URL
    hdoj1009 FatMouse' Trade——贪心算法
    hdoj2037 贪心算法——今年暑假不AC
  • 原文地址:https://www.cnblogs.com/wodehao0808/p/9086317.html
Copyright © 2011-2022 走看看