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

《JavaScript高级程序设计》笔记(2)

时间:2014-06-10 22:18:00      阅读:365      评论:0      收藏:0      [点我收藏+]

标签:style   class   blog   code   java   http   

1. <script>元素

在HTML中使用JavaScript脚本时需要使用<script>元素。

 

<script>主要有6个属性:

1. async:可选,表示应该立即下载脚本,但不应该妨碍页面中的其他操作。只对外部脚本文件有效。

2. charset: 可选,比较少用。

3. defer: 可选,表示脚本可以延迟到文档完全被解析或显示后才执行。只对外部脚本文件有效。

4. language: 已废弃。

5. src: 可选,表示包含要执行代码的外部文件。

6. type: 可选,表示编写代码使用的脚本语言的内容类型(MIME类型)。

 

使用<script>元素的方式有两种:

1. 直接在页面中插入JavaScript代码,例如:

<script type="text/javascript">
      function sayHi(){
         alert("Hi!");
       }
    </script>

2. 外部链接JavaScript文件,例如:

<script type="text/javascript" src="example.js"></script>

需要注意的是,带有src属性的<script>元素不应该在<script>和</script>间包含额外的JavaScript代码,否则在加载时会被忽略。

另外,src指定的URL地址不仅可以指向HTML页面所在域,也可以是其他域的完整URL,例如:

<script type="text/javascript" src="http://www.somewhere.com/afile.js"></script>

 

<script>元素的位置

<script>元素如果放在<head>元素中,对于需要很多JavaScript代码的页面而言,会导致浏览器在呈现页面内容时有明显的延迟,而延迟期间的浏览器窗口将是一片空白。所以采用将<script>元素放在</body>标签前,这样浏览器会先呈现页面内容,然后再解析和执行JavaScript代码。

2. 嵌入代码与外部文件

外部文件链接较嵌入代码主要有以下优点:

1. 可维护性:JavaScript代码(行为层)与HTML(结构层)分离,可以使开发人员集中处理JavaScript代码,而不用触及HTML文件。

2. 可缓存性:当两个及以上HTML文件共用相同的JavaScript文件时,当打开第一个HTML文件时,浏览器可以缓存所有的JavaScript文件,当打开其他HTML文件时可以快速加载,节约了流量。

3. 文档模式

在HTML文件的<head>元素中要声明文档类型(DOCTYPE)。因为文档模式有混杂模式和标准模式之分,在未声明文档类型时,浏览器会默认开启混杂模式,在这种情况下,各个浏览器会产生很大的行为差异。

对于标准模式,可以通过以下任意一种文档类型来开启:

bubuko.com,布布扣
<!-- HTML 4.01 严格型 –>
   <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
   "http://www.w3.org/TR/html4/strict.dtd">

   <!-- XHTML 1.0 严格型 –>
   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 STRICT//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

   <!-- HTML 5 –>
   <!DOCTYPE html>
bubuko.com,布布扣

显而易见,HTML5标准下的文档模式更简单,其他两种声明较复杂。

4. <noscript>元素

使用JavaScript要秉持两个基本原则:渐进增强和平稳退化。对于不支持JavaScript或禁用JavaScript的浏览器可以使用<noscript>元素做到平稳退化,例如:

bubuko.com,布布扣
<html>
     <head>
      <title>Example</title>
      <script type="text/javascript" src="example.js"></script>
     </head>
     <body>
       <noscript>
        <p>本页面需要浏览器支持(启用)JavaScript。</p>
       </noscript>
     </body>
    </html>
bubuko.com,布布扣

这个页面在不支持JavaScript或禁用JavaScript脚本的情况下,会显示一条提示。如果启用脚本,就不会看到<noscript>里的内容。

《JavaScript高级程序设计》笔记(2),布布扣,bubuko.com

《JavaScript高级程序设计》笔记(2)

标签:style   class   blog   code   java   http   

原文地址:http://www.cnblogs.com/robinstudio/p/3779214.html

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