对象模型与数据型态_电脑爱好者之家

对象模型与数据型态

文件对象模型
前言
传统上，HTML文件是"静态的"，换言之，文件的内容不会在执行的过程中更改。如果要有新的内容，那只有重新修改HTML文件然后再执行。虽然有些人可以应用微软的ActiveX 控制组件或是Java Applet 来做一些动态的网页内容，但这些方式通常都是有其限制的，而且必须额外下载一些组件才能做到。在1996年微软和另一家叫SoftQuad的公司提出了所谓的"文件对象模型"的规划书给WWW Consortium(W3C)，在这份规划书之中详述了一种方法，可以让浏灠器透过一种标准的机制来取用HTML文件中的内容。在1998年W3C协会正式发表了Document Object Model Level 1 的规格书。而目前微软公司的Explorer Dynamic HTML Object Model 可说是此一规格的实现。在Explorer的DOM 里面定义的东西可以参考一下附录。
对象与卷标
从前面的参考附录中，你可以发现几乎所的对象都有对应到一个HTML的卷标，而对象的属性也是对应到卷标的性质。而整个HTML文件之中，可以说是一些标签的"包含"关系。例如下面的叙述:
<P> <B> <I> Hello </I> </B> </P>

是<P> ... </P> 标签包含<B> ... </B>标签，再包含<I> ... </I>标签。这种包含的关系对应到对象模型的话，就是一个P 对象衍生一个B 对象，再衍生一个I 对象的关系。
对象的定义
每个网页中的对象都被完整的定义在对象模型中，而对象是对象模型之中最基本的单位。
一个对象包含了属性(Properties)、事件(Events)、方法(Methods)及集合(Collections)。分别说明如下：

属性(Properties)：属性就如同之前介绍HTML的一般标签是一样的，ALIGN、WIDTH......等等便是所谓的属性。
事件(Events)：事件就是前两周介绍的内容。有键盘和鼠标的事件。
方法(Methods)：所谓的方法就是对象所包含的一些函式，透过这些方法你可以存取对象的内容。
集合(Collections)：集合是一个特定对象的一组组件串行，就像图书馆中会有一堆书就可说图书馆是一堆书的集合。

在前几周介绍CSS的内容中，有提到ID及CLASS，那就是一个使用对象的好例子。
例如：ID="id_define"就是呼叫id_define这个对象，这就是对象导向的观念。
对象阶层
对象模型以阶层的方式定义所有对象，最高阶层的对象是window对象，它代表目前显示网页的Explorer或Frame。
继承：
如果一个网页上的组件包含另外一个组件时，被包含的组件在对象模型之中所代表的意义是一个对象包含的一个子对象(subobject)，用对象导向的术语来说，就是继承。
函式(Function)
函式简单来说就是一群拥有名称的程序代码，我们只要呼叫函式名称，就可以执行那一段程序，使得同一段程序可以重复使用。
例如下面这个例子，是一个名为Welcome的函式，它会在被呼叫到的时候显示一个警告对话框。

    Function Welcome()
    {
        alert("Welcome to JScript World !")
    }

Welcome这个函式可以在任何时候透过它的名称被呼叫。例如下面这个例子，在程序开启完之后执行它。

    <BODY onLoad=Welcome()>
    <P>本程序在加载完成之后，会有一个警示画面产生。</P>
    </BODY>

· 参数(Arguments)：
参数放在函式后面的括号中，它提供了一种可将数据传递给函式的方法。您可以利用逗号将参数隔开，一次传送多个数据给函式。
练习一：参数使用范例：

    <HTML>
    <HEAD>
    <TITLE> 轻松一下 </TITLE>
    <SCRIPT LANGUAGE="JavaScript">
    
    </SCRIPT>
    </HEAD>
    <BODY>

    <FORM>
      <INPUT TYPE="button" VALUE="Btn1" onclick="changeIt(this,'One')"><BR>
      <INPUT TYPE="button" VALUE="Btn2" onclick="changeIt(this,'Two')"><BR>
      <INPUT TYPE="button" VALUE="Btn3" onclick="changeIt(this,'Three')"><BR>
    </FORM>

    </BODY>
    </HTML>
看练习一执行的结果：

· 传回值(Returns)：
参数是用来将数据传给函式，而传回值则可以让我们得到函式执行的结果。
练习二：传回值使用范例：

    <HTML>
    <HEAD>
    <TITLE> 轻松一下 </TITLE>
    <SCRIPT LANGUAGE="JavaScript">
    
    </SCRIPT>
    </HEAD>
    <BODY>

    Type a number in the area below, and then click Calculate.<BR>
    The page will generate a random number between 1 and the number you entered.<BR>

    <FORM>
      <TEXTAREA NAME="TextNum">10
      </TEXTAREA><BR>
      <INPUT TYPE="button" VALUE="Calculate" onclick="tellUser(TextNum.value)">
    </FORM>

    </BODY>
  </HTML>

(责任编辑：熊猫蜀黍)

搜索

热门标签:

对象模型与数据型态