JavaScript学习笔记：浏览器中的JavaScript-技术开发专区

JavaScript学习笔记：浏览器中的JavaScript

作者：阿蜜果编辑：李宁 2007-09-03 00:00

【IT168 技术文档】

说明：本文为《JavaScript高级程序设计》第5章学习笔记。

本章探讨如何把JavaScript嵌入HTML及其他语言，并介绍了BOM（浏览器对象模型）的一些基本概念。

一．HTML中的JavaScript

1. <script/>标签

最初定义的JavaScript标签具有一个或两个特性，language特性声明要使用的脚本语言，src特性是可选的，声明要加入页面的外部JavaScript文件。language特性一般被设置为JavaScript，不过也可以用它声明JavaScript的确切版本，例如JavaScript 1.3（如果省略，浏览器默认使用最新的JavaScript版本）。

Eg1. <script language=”JavaScript”>

var i=0;

</script>

Eg2. <script language=”JavaScript” src=”external.js”></script>

2. 外部文件格式

外部文件中为只包含JavaSript代码的纯文本文件。在外部文件中不需要<script/>标签。

Eg. <script language=”JavaScript” src=”external.js”></script>

external.js的内容如下：

function sayHello() {

alert(“Hello!”);

}

3. 内嵌代码和外部格式

一般认为，大量的JavaScript不应内嵌到HTML文件中，原因如下：

l 安全性——只要查看页面的源代码，任何人都可确切地知道其中的代码做了什么。如果怀有恶意的开发者查看了源代码，就可能发现系统漏洞，危及整个站点或应用程序的安全。此外，在外部文件中还可加入版权和其他知识产权通告，而不打算页面流；

l 代码维护——如果JavaScript代码散布于多个页面，那么代码维护将变成一场噩梦。

l 缓存——浏览器会根据特定的设置缓存所有外部链接的JavaScript文件，这意味着如果两个页面使用同一个文件，只需要下载该文件一次。这将加快下载速度。把同一段代码放入多个页面中，不只浪费，还增加了页面大小，从而增加下载时间。

4．标签放置

一般放在<head/>中，这样在显示页面主题后，这些代码就被完全装载进浏览器。唯一该出现在<body/>标签中的代码是调用前面定义的函数的代码。

Eg.

<html>
  <head>
    <title>测试</title>
    <script language="JavaScript">
        function sayHi()
{
alert("Hi");
}
</script>
  </head>
  <body>
     <input type="button" value="调用函数" onclick="sayHi()"/>
  </body>

</html>

5. 隐藏还是不隐藏

若要在不支持JavaScript的浏览器中隐藏<script/>的代码。

       Eg.
<script language="JavaScript">
              <!—
                     function sayHi() {
       alert("Hi");
}
              //-->
              </script>

6．<noscript/>标签

不支持JavaScript的浏览器另外一个令人关注的是如何提供替代的内容。隐藏代码只是解决方法的一部分，开发者还需要一种方法，声明在JavaScript不能用时应该显示的内容。解决方法是采用<noscript/>标签，它可包含任何HTML代码（除<script/>）。支持或启用JavaScript的浏览器会忽略这些HTML代码，不支持的则显示<noscript/>的内容。

7．XHTML中的改变

近年来，随着XHTML标准的出现，<script/>标签也经历了一些改变。它不再用language特性，而用type特性来声明要加入的外部文件的mine类型。

Eg. <script type=”text/javascript” src=”external.js”></script>

第1页：HTML中的JavaScript 第2页：SVG中的JavaScript

关注我们