professional javascript for web developers 2nd_edition读书笔记（二）

最新推荐文章于 2024-10-02 05:39:15 发布

lmjq

最新推荐文章于 2024-10-02 05:39:15 发布

阅读量814

点赞数

分类专栏： JavaScript 文章标签： javascript 读书 web xhtml 浏览器 html

本文链接：https://blog.csdn.net/lmjq/article/details/5451636

版权

JavaScript 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

第二章 JavaScript in HTML

1 、 The < script > Element

< script > 是 html 的正式规范的范围。 HTML 4.01 为 < script > 定义如下特性：

n charset －　可选，用 src 制定字符集编码。很少用，因大部分浏览器不太支持。

n defer －　可选， script 的执行将会安全延期到 document 的内容完全解析现实之后再执行。

n language －　不赞成，大多数浏览器将忽略此特性，所以不应使用此特性。

n src －　可选，外部 script 的文件。

n type －　必须。看做 是 language 的替代。指出脚本语言的 the content type （也称为 MIME type ），一般此值为 “text/javascript ”。

包含 < script > 的两种方式：

1 、在网页中包含在线 < script > ，只需设置 type 即可，如

< script type=”text/javascript”>

function sayHi()

{

alert( “ Hi! ” );

}

< /script >

在 < script > element 中的代码会自上往下顺序解释，只有此代码执行后，后面的页面才会显示。

2 、在网页中包含外部文件， 则设置 src 如： < script type= ” text/javascript ” src= ” example.js ” > < /script >

NOTE: <script> 元素如果包含有利用 src 包含外部文件，则 < script > 和 < /script > tags 中间不能再有 JavaScript 代码。、

2 、 Tag Placement

通常， < script > 放在 <head> 中，这样做的目的是将 JavaScript 外部文件和 css 外部文件放在同一个区域中，但这样的缺点是：只有全部的外部 JavaScript 文件完全下载完、解析完、解释完后，页面才开始呈现（浏览器只有收到 <body> 标签时才开始呈现页面内容）。

3 、 Deferred Scripts

HTML 4.01 为 < script > 元素定义了一个属性 defer ，如果设定 defer= ” defer ”，则只有在整个页面执行完后，此 < script > 才开始运行。此属性相当于将 < script > 放在整个网页的底部。 IE and Firefox 3.1 支持此属性，其它的浏览器未必支持（注意），此属性例子如：

< html >

< head >

< title > Example HTML Page < /title >

< script type= ”text/javascript ” defer= ”defer ” src= ”example1.js ” > < /script >

< /head >

< body >

< !-- content here -- >

< /body >

< /html >

在上例中，只有当浏览器收到标签 < /html > 后才会执行 <script> 中代码；

4 、 Changes in XHTML

Extensible HyperText Markup Language, or XHTML , is a reformulation of HTML as an application

of XML. XHTML 的编码规则比 html 的编码规则要严格的多，同样影响到在线 < script/ > 。

在 HTML 中， < script > 元素有其特别的规则来管理其内容如何被解析，此与 XHTML 中不同，如：在语句 a < b 中小于号（ < ）被解释为标签的开始。

有两种方法来解决 XHTML 语法错误：

1、利用实体 entity ( & lt; ) 代替小于号（ < ） : 此方法不易读。

< 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 >

2、用 CData 段包围 script ：

< script type= ” text/javascript ” >

< ![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 >

但有些浏览器不支持 < ![CDATA[ ]] > ，则此 < ![CDATA[ ]] > 必须掉注释。

< script type= ” text/javascript ” >

// < ![CDATA[

script 内容。。。。。。。

//]] >

< /script >

5 、 Deprecated Syntax

有些浏览器不支持 JavaScript ( 如： Mosaic) ，不支持的浏览器将会在页面上直接输出 < script > 的内容。这将破坏原来页面的整体。

解决方案：用 HTML 注释将 script 代码封装起来。不支持 JavaScript 的浏览器将会忽略掉封装的内容，支持 JavaScript 的浏览器将会正常解析。

< script > < !--

function sayHi()

{

alert( “ Hi! ” );

}

//-- > < /script >

6 、 Inline Code versus External Files

利用 External Files 的优势：

ü Maintainability （易于维护）－　开发者可以只编辑 External File ，独立于利用此文件的标签。

ü Caching （缓存） — 通过某特定设定，浏览器可缓存 External File ，如：如果两个页面引用同一个 External File ，则此文件只加载一次。

ü Future - proof — 引用 External File ，不存在前述担心的语法问题。 HTML and XHTML 包含 External File 的语法是一样的。

7 、 Document Modes

DOCTYPE 是 document type( 文档类型 ) 的简写，在Ｗ eb 设计中用来说明你用的 XHTML 或者 HTML 是什么版本。　　要建立符合标准的网页， DOCTYPE 声明是必不可少的关键组成部分；除非你的 XHTML 确定了一个正确的 DOCTYPE ，否则你的标识和 CSS 都不会生效。　　设计网页的过程中，应该怎样正确的选择和使用 DOCTYPE