JavaScript入门教程(五)_javascript教程教程_H5之家 - 中国HTML5教程资源分享第一站

文章添加日期：2005-9-18 观看人数：1274

　

使用框架和Cookies
使用框架

在讲述 window 对象的时候，我们提到过，一个框架内的网页也是 window 对象，也就是说，Frame 对象也是 window
对象。用最容易理解的话说，每一个 HTML 文件占用一个 window 对象，包括定义框架的网页（“框架网页”）。在 IE 里用“<iframe>”标记在文档中插入的框架也是
window 对象，但是用“包含网页”的方法（在 HTML 中显示为“”）读取的 HTML
就不占用独自的 window 对象。每一个框架都是包含它的页的 window 对象的一个子对象（不知道应该叫“属性”不该），要引用它，可以用以下几种方法之一：

window.frames[x]

window.frames['frameName']

window.frameName

　　其中，x 指的是该 window 对象中指定的第几个框架，与其它数组一样，x 也是从零开始的。frameName
指的是该框架的名字，跟<frame>里的“name”属性一样。

　　如果使用 window.frameName 指定的 window
对象又是一个框架网页，那么引用它的框架的方法：window.frameName.subFrameName。以此类推。

　　要注意的时，无论在何处，引用“window”对象所返回的，都是“当前”window 对象。如果要访问其它 window 对象，就要用到 parent
和 top 属性。parent 指的是“父级”window 对象，也就是包含当前 window 对象的框架网页；top 指的是窗口最顶端的 window 对象。

　　使用框架还要密切留意你的 JavaScript 中定义的全局变量和自定义函数。它们都有它们的所属——所在的 window
对象。要引用其它框架中的全局变量或自定义函数，都要用“窗口对象.框架对象[.框架对象…].全局变量或自定义函数”这种很烦的方法。

　　以上这个问题在建立连接时经常会被忽略：如果在<head>中定义了一个默认目标窗口（<base target="...">），在<a
href="javascript:...">中，要知道输入的 JavaScript 语句是在默认目标窗口中运行的，必要时加一些“parent”“top”属性。

使用 Cookies

　　我们已经知道，在 document 对象中有一个 cookie 属性。但是 Cookie 又是什么？“某些 Web
站点在您的硬盘上用很小的文本文件存储了一些信息，这些文件就称为 Cookie。”—— MSIE 帮助。一般来说，Cookies 是 CGI 或类似，比 HTML
高级的文件、程序等创建的，但是 JavaScript 也提供了对 Cookies 的很全面的访问权利。

　　在继续之前，我们先要学一学
Cookie 的基本知识。

　　每个 Cookie 都是这样的：<cookie名>=<值>

　　<cookie名>的限制与 JavaScript 的命名限制大同小异，少了“不能用 JavaScript 关键字”，多了“只能用可以用在 URL
编码中的字符”。后者比较难懂，但是只要你只用字母和数字命名，就完全没有问题了。<值>的要求也是“只能用可以用在 URL 编码中的字符”。

　　每个 Cookie 都有失效日期，一旦电脑的时钟过了失效日期，这个 Cookie 就会被删掉。我们不能直接删掉一个
Cookie，但是可以用设定失效日期早于现在时刻的方法来间接删掉它。

　　每个网页，或者说每个站点，都有它自己的 Cookies，这些 Cookies
只能由这个站点下的网页来访问，来自其他站点或同一站点下未经授权的区域的网页，是不能访问的。每一“组”Cookies 有规定的总大小（大约 2KB
每“组”），一超过最大总大小，则最早失效的 Cookie 先被删除，来让新的 Cookie“安家”。

　　现在我们来学习使用
document.cookie 属性。

　　如果直接使用 document.cookie 属性，或者说，用某种方法，例如给变量赋值，来获得 document.cookie
的值，我们就可以知道在现在的文档中有多少个 Cookies，每个 Cookies 的名字，和它的值。例如，在某文档中添加“document.write(document.cookie)”，结果显示：

name=kevin; email=kevin@kevin.com; lastvisited=index.html

这意味着，文档包含 3 个 Cookies：name, email 和 lastvisited，它们的值分别是 kevin,
kevin@kevin.com 和 index.html。可以看到，两个 Cookies 之间是用分号和空格隔开的，于是我们可以用
cookieString.split('; ') 方法得到每个 Cookie 分开的一个数组（先用 var cookieString =
document.cookie）。

　　设定一个 Cookie 的方法是对 document.cookie 赋值。与其它情况下的赋值不同，向 document.cookie
赋值不会删除掉原有的 Cookies，而只会增添 Cookies 或更改原有 Cookie。赋值的格式：

document.cookie = 'cookieName=' + escape('cookieValue')

+ ';expires=' + expirationDateObj.toGMTString();

是不是看到头晕了呢？以上不是粗体字的地方是要照抄不误的，粗体字是要按实际情况做出改动的。cookieName 表示 Cookie
的名称，cookieValue 表示 Cookie 的值，expirationDateObj
表示储存着失效日期的日期对象名，如果不需要指定失效日期，则不需要第二行。不指定失效日期，则浏览器默认是在关闭浏览器（也就是关闭所有窗口）之后过期。

　　看到了上面的一些下划线了么？这些是应该注意的地方。

　　首先 escape() 方法：为什么一定要用？因为 Cookie 的值的要求是“只能用可以用在 URL
编码中的字符”。我们知道“escape()”方法是把字符串按 URL 编码方法来编码的，那我们只需要用一个“escape()”方法来处理输出到 Cookie
的值，用“unescape()”来处理从 Cookie 接收过来的值就万无一失了。而且这两个方法的最常用途就是处理 Cookies。其实设定一个 Cookie
只是“document.cookie = 'cookieName=cookieValue'”这么简单，但是为了避免在 cookieValue 中出现 URL
里不准出现的字符，还是用一个 escape() 好。

　　然后“expires”前面的分号：注意到就行了。是分号而不是其他。

　　最后 toGMTString() 方法：设定 Cookie 的时效日期都是用 GMT 格式的时间的，其它格式的时间是没有作用的。

　　现在我们来实战一下。设定一个“name=rose”的 Cookie，在 3 个月后过期。