码迷,mamicode.com
首页 > 编程语言 > 详细

《JavaScript高级程序设计》 总结(一)

时间:2016-11-25 16:47:05      阅读:190      评论:0      收藏:0      [点我收藏+]

标签:web   设计   标签   tle   css   nts   下载   script   应用   

标签的位置


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

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <title>Example HTML Page</title>
 5 <script type="text/javascript" src="example1.js"></script>
 6 <script type="text/javascript" src="example2.js"></script>
 7 </head>
 8 <body>
 9 <!-- 这里放内容 -->
10 </body>
11 </html>

这种做法的目的就是把所有外部文件(包括 CSS 文件和 JavaScript 文件)的引用都放在相同的地方。
可是,在文档的<head>元素中包含所有 JavaScript 文件,意味着必须等到全部 JavaScript 代码都被下载、
解析和执行完成以后,才能开始呈现页面的内容(浏览器在遇到<body>标签时才开始呈现内容)。对于
那些需要很多 JavaScript 代码的页面来说,这无疑会导致浏览器在呈现页面时出现明显的延迟,而延迟
期间的浏览器窗口中将是一片空白。为了避免这个问题,现代 Web 应用程序一般都把全部 JavaScript
用放在<body>元素中页面内容的后面,如下例所示:

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <title>Example HTML Page</title>
 5 </head>
 6 <body>
 7 <!-- 这里放内容 -->
 8 <script type="text/javascript" src="example1.js"></script>
 9 <script type="text/javascript" src="example2.js"></script>
10 </body>
11 </html>

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

 

《JavaScript高级程序设计》 总结(一)

标签:web   设计   标签   tle   css   nts   下载   script   应用   

原文地址:http://www.cnblogs.com/li--xin/p/6101805.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!