书中第2章，在HTML中使用JavaScript摘要总结

2.1 <script>元素

<script>中的5个属性：
charset：可选。表示通过src属性指定的代码的字符集。多数浏览器会忽略它的值，很少人使用。
defer：可选。表示脚本可以延迟到文档完全被解析和显示之后再执行。IE和Firefox3.1是目前唯一支持defer属性的主流浏览器。其他浏览器则会忽略，不延迟脚本的执行。
language：已废弃。原来用于表示编写代码使用的脚本语言（如JavaScript、JavaScript1.2或VBScript）。
src：可选。表示包含要执行代码的外部文件。
type：必需。表示编写代码使用的脚本语言的内容类型（也称为MIME类型）。通常为text/javascript。

包含在<script>元素内的JavaScript代码将被从上至下依次解释。在解释器对<script>元素内部的所有代码求值完成以前，页面中的其余内容都不会被浏览器加载或显示。

在使用<script>嵌入JavaScript代码时，任何地方不能出现"<script>"字符串。
<script
type="text/javascript">
    function sayScript(){
       
alert("</script>");  //此处会报错
    }
</script>
可将"</script>"分开写，避免错误。
<script
type="text/javascript">
    function
sayScript(){
        alert("</scr" + "ipt>"); 
    }
</script>

src属性可以指向当前HTML页面所在域之外的某个域中的URL，例如
<script
type="text/javascript" src="http://www.somewhere.com/afile.js"></script>

2.1.1 标签的位置

按照惯例，所有的<script>元素都应该放在页面的<head>元素中，可是，这将意味着必须等到全部JavaScript代码都被下载、解析和执行完成以后，才能呈现页面内容（浏览器在遇到<body>标签时才开始呈现内容）。对于需要很多JavaScript代码的页面来说，会导致呈现页面时出现的延迟现象。为了避免这种现象发生，可以把全部JavaScript引用发在页面的内容后面或增加defer属性，如下例所示：
<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>

2.1.3 在XHTML中的用法

某些JavaScript代码在HTML中是有效的，但在XHTML中则是无效的：
<script
type="text/javascript">
    function compare(a, b) {
        if (a < b) {
            alert("A is less
than B");
        } else if (a > b) {
            alert("A is greater
than B");
        } else {
            alert(" A is equal to
B");
        }
    }
</script>
代码中的比较语句a < b
中的小于号（<）在XHTML中将被当作开始一个新标签来解析。但是作为标签来讲，小于号后面不能跟空格，因此就会导致语法错误。
避免类似语法错误的方法有两个。一是用相应的HTML实体（&lt;）替换小于号（<）,替换后的代码如下：
<script
type="text/javascript">
    function compare(a,
b) {
        if (a
&lt;
b) {
            alert("A is
less than B");
        }
else if (a > b) {
           
alert("A is greater than
B");
        } else
{
            alert(" A is equal to
B");
        }
    }
</script>
这样虽然可以运行，但不便于理解。因此可用第二种方法，用一个CData片段来包含JavaScript代码。在XHTML（XML）中，CData片段是文档中的一个特殊区域，这个区域中可以包含不需要解析的任意格式的文本内容。
<script
type="text/javascript">
//某些浏览器不兼容XHTML，因而不支持CData片段，可以使用JavaScript注释将CData标记注释掉
//<![CDATA[        
    function
compare(a, b) {
        if (a < b)
{
            alert("A is less than
B");
        } else if (a > b) {
           
alert("A is greater than B");
        } else
{
            alert(" A is equal to
B");
        }
    }
//]]>
</script>

2.3 <noscript>元素

这个元素可以包含能够出现在文档<body>中的任何HTML元素——<script>元素除外，包含在<nosript>元素中的内容只有在下列情况下才会显示出来：
1.浏览器不支持脚本
2.浏览器支持脚本，但脚本被禁用。
<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>
        <noscript>
           
<p>本页面需要浏览器支持（启用）JavaScript</p>
       
</noscript>
    </body>
</html>

以上所有内容均摘自图书《JavaScript 高级程序设计（第2版）》[美] Nicholas
C.Zakas 著 李松峰 曹力 译

JavaScript高级编程（一）的更多相关文章

  1. javascript高级编程笔记01(基本概念)

    1.在html中使用JavaScript 1.  <script> 元素 <script>定义了下列6个属性: async:可选,异步下载外部脚本文件. charset:可选, ...

  2. JavaScript高级编程———JSON

    JavaScript高级编程———JSON < script > /*JSON的语法可以表达一下三种类型的值 简单值:使用与javas相同的语法,可以在JSON中表达字符串.数值.布尔值和 ...

  3. JavaScript高级编程———基本包装类型String和单体内置对象Math

    JavaScript高级编程———基本包装类型和单体内置对象 <script> var stringObject = new String("hello world") ...

  4. JavaScript高级编程——Date类型

    JavaScript高级编程——Date类型 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" ...

  5. JavaScript高级编程——Array数组迭代（every()、filter()、foreach()、map()、some()，归并（reduce() 和reduceRight() ））

    JavaScript高级编程——Array数组迭代(every().filter().foreach().map().some(),归并(reduce() 和reduceRight() )) < ...

  6. JavaScript高级编程——引用类型、Array数组使用、栈方法

    JavaScript高级编程——引用类型.Array数组使用.栈方法 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999 ...

  7. JavaScript高级编程———数据存储（cookie、WebStorage）

    JavaScript高级编程———数据存储(cookie.WebStorage) <script> /*Cookie 读写删 CookieUtil.get()方法根据cookie的名称获取 ...

  8. JavaScript高级编程 (1) - javscript是什么

    <重温javascript>这是一系列 javascript 的学习笔记,部分内容摘自书本或者网络,我这里只是基于自己的理解进行了梳理整理. 一个完整的 javscript 实现是由以下3 ...

  9. JavaScript高级编程II

         原文地址: http://www.onlamp.com/pub/a/onlamp/2007/08/23/advanced-javascript-ii.html?page=1 在前面的文章中, ...

随机推荐

  1. javascript高级函数

    高级函数 安全的类型检测 js内置的类型检测并非完全可靠,typeof操作符难以判断某个值是否为函数 instanceof在多个frame的情况下,会出现问题. 例如:var isArray = va ...

  2. Apple Remote Push Notifications

    1.帮助文档参考: https://developer.apple.com/library/ios/documentation/NetworkingInternet/Conceptual/Remote ...

  3. .net程序集强名称签名实践

    引用:  http://www.cnblogs.com/cpcpc/archive/2011/01/17/2123086.html 强名称是由程序集的标识加上公钥和数字签名组成的.其中,程序集的标识包 ...

  4. 从程序员到CTO的Java技术路线图 （转自安卓巴士）

    在技术方面无论我们怎么学习,总感觉需要提升自已不知道自己处于什么水平了.但如果有清晰的指示图供参考还是非常不错的,这样我们清楚的知道我们大概处于那个阶段和水平. Java程序员 高级特性 反射.泛型. ...

  5. UML类图（转载）

    概述: 类图是静态图.它代表了一个应用程序的静态视图.类图不仅用于可视化描述和记录系统的不同方面,但也为构建可执行代码的软件应用程序. 类图描述一类的属性和操作,也对系统的约束.被广泛应用于类图的建模 ...

  6. 【ASP.Net MVC】在AspNet Mvc使用JQuery AutoComplete组件

    在AspNet Mvc使用JQuery AutoComplete组件 官方文档: http://api.jqueryui.com/autocomplete/#entry-examples 要使用JQu ...

  7. cache应用（asp.net 2.0 SQL数据缓存依赖 [SqlCacheDependency ] ）

    Asp.net 2.0 提供了一个新的数据缓存功能,就是利用sql server2005 的异步通知功能来实现缓存 1.首先在sqlserver2005 中创建一个test的数据库. 在SQL Ser ...

  8. AssetBundle机制相关资料收集

    原地址:http://www.cnblogs.com/realtimepixels/p/3652075.html AssetBundle机制相关资料收集 最近网友通过网站搜索Unity3D在手机及其他 ...

  9. LCS最长公共子序列（最优线性时间O(n)）

    这篇日志主要为了记录这几天的学习成果. 最长公共子序列根据要不要求子序列连续分两种情况. 只考虑两个串的情况,假设两个串长度均为n. 一,子序列不要求连续. (1)动态规划(O(n*n)) (转自:h ...

  10. Win7系统配置IIS7服务

    1.开启IIS7服务 打开控制面板,选择并进入“程序”,双击“打开或关闭Windows服务”,在弹出的窗口中选择“Internet信息服务”下面所有地选项,点击确定后,开始更新服务. 2.安装web文 ...