JavaScript傳統DOM

這是將其在JavaScript語言早期版本中引入的模型。大家都被所有流覽器都支持,但只允許訪問檔的某些關鍵部分,如表單,表單元素和圖像。

該模型提供了若干個只讀屬性,如標題,URL和上次更改提供關於文檔整體的資訊。除了有由該模型可用於設置和獲取文檔的屬性值提供各種方法。

文檔屬性在傳統DOM:

下麵是文檔屬性,可以使用傳統DOM訪問列表:

屬性 介紹和示例
alinkColor 棄用 - 一個字串,指定啟動鏈接的顏色。
例如:document.alinkColor
anchors[ ] 錨對象的每個錨的數組,出現在文檔中
示例: document.anchors[0], document.anchors[1] 等等
applets[ ] Applet對象為每個小程式的數組,一個出現在文檔中
例如: document.applets[0], document.applets[1] 等等
bgColor Deprecated - 一個字串,指定文檔的背景顏色
例如: document.bgColor
cookie 有特殊行為的一個字串值屬性,允許與此文檔相關的cookie來進行查詢和設置
例如: document.cookie
domain 一個字串,是從指定互聯網領域的檔。用於安全目的
例如: document.domain
embeds[ ] 代表嵌入使用<embed>標籤的文檔中的數據對象的數組。同義詞的plugins[]。一些插件和ActiveX控件可以用JavaScript代碼來控制。
例如: document.embeds[0], document.embeds[1] 等等
fgColor 棄用 - 一個字串,指定文檔的默認文本顏色
例如: document.fgColor
forms[ ] 一種形式的數組對象,一個用於顯示的文檔中的每個HTML表單。 
例如: document.forms[0], document.forms[1] 等等
images[ ] Image對象的數組,一個嵌入HTML <img>標籤的文檔中的每個圖像。
例如: document.images[0], document.images[1] 等等
lastModified 一個只讀字串,指定最近的更改日期的檔
例如: document.lastModified
linkColor 棄用 - 一個字串,指定的未訪問鏈接的顏色
例如: document.linkColor
links[ ] links[ ] 
例如: document.links[0], document.links[1] 等等
location 該檔的URL。不贊成使用的URL屬性
例如: document.location
plugins[ ] embeds[ ] 的代名詞 
例如: document.plugins[0], document.plugins[1] and so on
referrer 包含該文檔的URL,如果有的話,從該當前文檔被掛只讀字串
例如: document.referrer
title 在<title>標籤的文本內容
例如: document.title
URL 一個只讀字串,指定文檔的URL
例如: document.URL
vlinkColor 棄用 - 一個字串,指定訪問過的鏈接的顏色
例如:document.vlinkColor

文檔方法在傳統DOM:

這裏是由傳統DOM支持的方法列表:

屬性 介紹和示例
clear( ) 棄用- 刪除的檔,不返回任何內容
示例: document.clear( )
close( ) 關閉打開open()方法返回任何文檔流
示例: document.close( )
open( ) 刪除現有文檔的內容,並打開一個流到新文檔的內容可能會被寫入。不返回任何內容。
示例: document.open( )
write( value, ...) 將指定的字串或字串插入到文檔中正在解析或附加檔開放open()。不返回任何內容。
示例: document.write( value, ...)
writeln( value, ...) 完全相同於write( ),但它附加一個換行符輸出。不返回任何內容
示例: document.writeln( value, ...)

例子:

我們可以找到任何HTML元素,使用HTML DOM任何HTML文檔。例如,如果一個網頁檔包含一個表單元素,然後使用JavaScript,我們可以把它稱為document.forms[0]。如果Web文檔包括兩個形式元素的第一種形式被稱為document.forms[0]和第二為document.forms[1]。

利用上面給出的層次結構和性質,可以使用document.forms[0].elements[0]等。

下麵是一個例子訪問使用傳統DOM方法文檔屬性:

<html>
<head>
<title> Document Title </title>
<script type="text/javascript">
<!--
function myFunc()
{
   var ret = document.title;
   alert("Document Title : " + ret );

   var ret = document.URL;
   alert("Document URL : " + ret );

   var ret = document.forms[0];
   alert("Document First Form : " + ret );

   var ret = document.forms[0].elements[1];
   alert("Second element : " + ret );

}
//-->
</script>
</head>
<body>
<h1 id="title">This is main title</h1>
<p>Click the following to see the result:</p>

<form name="FirstForm">
<input type="button" value="Click Me" onclick="myFunc();" />
<input type="button" value="Cancel">
</form>

<form name="SecondForm">
<input type="button" value="Don't ClickMe"/>
</form>

</body>
</html>

注意: 這個例子的形式和內容等返回對象,我們將不得不使用未在本教學中討論這些對象的屬性來訪問它們的值。

 


上一篇: JavaScript文檔對象模型或DOM 下一篇: JavaScript W3C DOM