快捷導(dǎo)航

JavaScript入門(mén)教程(10) 認(rèn)識(shí)其他對(duì)象

更新時(shí)間：2009年01月31日 23:40:23 作者：

對(duì)于需要更好的控制html的一些元素，就需要了解這些了。大家知道就行，有需要時(shí)可以再看。

anchors[]; links[]; Link 連接對(duì)象
用法：document.anchors[[x]]; document.links[[x]]; <anchorId>; <linkId>
　　document.anchors 是一個(gè)數(shù)組，包含了文檔中所有錨標(biāo)記（包含 name 屬性的<a>標(biāo)記），按照在文檔中的次序，從 0 開(kāi)始給每個(gè)錨標(biāo)記定義了一個(gè)下標(biāo)。
　　document.links 也是一個(gè)數(shù)組，包含了文檔中所有連接標(biāo)記（包含 href 屬性的<a>標(biāo)記和<map>標(biāo)記段里的<area>標(biāo)記），按照在文檔中的次序，從 0 開(kāi)始給每個(gè)連接標(biāo)記定義了一個(gè)下標(biāo)。
　　如果一個(gè)<a>標(biāo)記既有 name 屬性，又有 href 屬性，則它既是一個(gè) Anchor 對(duì)象，又是一個(gè) Link 對(duì)象。
　　在 IE 中，如果在<a>標(biāo)記中添加“id="..."”屬性，則這個(gè)<a>對(duì)象被賦予一個(gè)標(biāo)識(shí)（ID），調(diào)用這個(gè)對(duì)象的時(shí)候只需要使用“<id>”就行了。很多文檔部件都可以用這個(gè)方法來(lái)賦予 ID，但要注意不能有兩個(gè) ID 相同。
anchors 和 links 作為數(shù)組，有數(shù)組的屬性和方法。單個(gè) Anchor 對(duì)象沒(méi)有屬性；單個(gè) Link 對(duì)象的屬性見(jiàn)下。

屬性
protocol; hostname; port; host; pathname; hash; search; href 與 location 對(duì)象相同。
target 返回/指定連接的目標(biāo)窗口（字符串），與<a>標(biāo)記里的 target 屬性是一樣的。
事件
onclick; onmouseover; onmouseout; onmousedown; onmouseup

applets[] Java小程序?qū)ο?/FONT> 它是一個(gè)數(shù)組，包含了文檔中所有的 Applet 對(duì)象（Java 小程序）。作為一個(gè)數(shù)組，有數(shù)組的屬性和方法。關(guān)于單個(gè) Applet 對(duì)象的屬性和方法，我引用一句話：“Applet 對(duì)象繼承了 Java 小程序的所有公共屬性和方法。”(英文原句：The Applet object inherits all public properties of the Java applet./The Applet object inherits all public methodss of the Java applet.) 因?yàn)楸救撕軈拹?Java 小程序，所以對(duì)它的什么“公共”“私有”的問(wèn)題不感興趣，也就沒(méi)有探討了。
embeds[] 插件對(duì)象 它是一個(gè)數(shù)組，包含了文檔中所有的插件（<embed>標(biāo)記）。因?yàn)槊總€(gè)插件的不同，每個(gè) Embed 對(duì)象也有不同的屬性和方法。
forms[]; Form 表單對(duì)象 document.forms[] 是一個(gè)數(shù)組，包含了文檔中所有的表單（<form>）。要引用單個(gè)表單，可以用 document.forms[x]，但是一般來(lái)說(shuō)，人們都會(huì)這樣做：在<form>標(biāo)記中加上“name="..."”屬性，那么直接用“document.<表單名>”就可以引用了。

Form 對(duì)象的屬性
name 返回表單的名稱(chēng)，也就是<form name="...">屬性。
action 返回/設(shè)定表單的提交地址，也就是<form action="...">屬性。
method 返回/設(shè)定表單的提交方法，也就是<form method="...">屬性。
target 返回/設(shè)定表單提交后返回的窗口，也就是<form target="...">屬性。
encoding 返回/設(shè)定表單提交內(nèi)容的編碼方式，也就是<form enctype="...">屬性。
length 返回該表單所含元素的數(shù)目。
方法
reset() 重置表單。這與按下“重置”按鈕是一樣的。
submit() 提交表單。這與按下“提交”按鈕是一樣的。
事件
onreset; onsubmit

以下從“Button”到“Textarea”都是表單的元素對(duì)象。
Button 按鈕對(duì)象 由“<input type="button">”指定。引用一個(gè) Button 對(duì)象，可以使用“<文檔對(duì)象>.<表單對(duì)象>.<按鈕名稱(chēng)>”。<按鈕名稱(chēng)>指在<input>標(biāo)記中的“name="..."”屬性的值。引用任意表單元素都可以用這種方法。

屬性
name 返回/設(shè)定用<input name="...">指定的元素名稱(chēng)。
value 返回/設(shè)定用<input value="...">指定的元素的值。
form 返回包含本元素的表單對(duì)象。
方法
blur() 從對(duì)象中移走焦點(diǎn)。
focus() 讓對(duì)象獲得焦點(diǎn)。
click() 模擬鼠標(biāo)點(diǎn)擊該對(duì)象。
事件
onclick; onmousedown; onmouseup

Checkbox 復(fù)選框?qū)ο?/FONT> 由“<input type="checkbox">”指定。

屬性
name 返回/設(shè)定用<input name="...">指定的元素名稱(chēng)。
value 返回/設(shè)定用<input value="...">指定的元素的值。
form 返回包含本元素的表單對(duì)象。
checked 返回/設(shè)定該復(fù)選框?qū)ο笫欠癖贿x中。這是一個(gè)布爾值。
defaultChecked 返回/設(shè)定該復(fù)選框?qū)ο竽J(rèn)是否被選中。這是一個(gè)布爾值。
方法
blur() 從對(duì)象中移走焦點(diǎn)。
focus() 讓對(duì)象獲得焦點(diǎn)。
click() 模擬鼠標(biāo)點(diǎn)擊該對(duì)象。
事件
onclick

elements[]; Element 表單元素對(duì)象 <表單對(duì)象>.elements 是一個(gè)數(shù)組，包含了該表單所有的對(duì)象。一般我們不用該數(shù)組，而直接引用各個(gè)具體的對(duì)象。
Hidden 隱藏對(duì)象 由“<input type="hidden">”指定。

屬性
name 返回/設(shè)定用<input name="...">指定的元素名稱(chēng)。
value 返回/設(shè)定用<input value="...">指定的元素的值。
form 返回包含本元素的表單對(duì)象。

Password 密碼輸入?yún)^(qū)對(duì)象 由“<input type="password">”指定。

屬性
name 返回/設(shè)定用<input name="...">指定的元素名稱(chēng)。
value 返回/設(shè)定密碼輸入?yún)^(qū)當(dāng)前的值。
defaultValue 返回用<input value="...">指定的默認(rèn)值。
form 返回包含本元素的表單對(duì)象。
方法
blur() 從對(duì)象中移走焦點(diǎn)。
focus() 讓對(duì)象獲得焦點(diǎn)。
select() 選中密碼輸入?yún)^(qū)里全部文本。
事件
onchange

Radio 單選域?qū)ο?/FONT> 由“<input type="radio">”指定。一組 Radio 對(duì)象有共同的名稱(chēng)（name 屬性），這樣的話，document.formName.radioName 就成了一個(gè)數(shù)組。要訪問(wèn)單個(gè) Radio 對(duì)象就要用：document.formName.radioName[x]。

單個(gè) Radio 對(duì)象的屬性
name 返回/設(shè)定用<input name="...">指定的元素名稱(chēng)。
value 返回/設(shè)定用<input value="...">指定的元素的值。
form 返回包含本元素的表單對(duì)象。
checked 返回/設(shè)定該單選域?qū)ο笫欠癖贿x中。這是一個(gè)布爾值。
defaultChecked 返回/設(shè)定該對(duì)象默認(rèn)是否被選中。這是一個(gè)布爾值。
方法
blur() 從對(duì)象中移走焦點(diǎn)。
focus() 讓對(duì)象獲得焦點(diǎn)。
click() 模擬鼠標(biāo)點(diǎn)擊該對(duì)象。
事件
onclick

Reset 重置按鈕對(duì)象 由“<input type="reset">”指定。因?yàn)?Reset 也是按鈕，所以也有 Button 對(duì)象的屬性和方法。至于“onclick”事件，一般用 Form 對(duì)象的 onreset 代替。
Select 選擇區(qū)（下拉菜單、列表）對(duì)象 由“<select>”指定。

屬性
name 返回/設(shè)定用<input name="...">指定的元素名稱(chēng)。
length 返回 Select 對(duì)象下選項(xiàng)的數(shù)目。
selectedIndex 返回被選中的選項(xiàng)的下標(biāo)。這個(gè)下標(biāo)就是在 options[] 數(shù)組中該選項(xiàng)的位置。如果 Select 對(duì)象允許多項(xiàng)選擇，則返回第一個(gè)被選中的選項(xiàng)的下標(biāo)。
form 返回包含本元素的表單對(duì)象。
方法
blur() 從對(duì)象中移走焦點(diǎn)。
focus() 讓對(duì)象獲得焦點(diǎn)。
事件
onchange

options[]; Option 選擇項(xiàng)對(duì)象 options[] 是一個(gè)數(shù)組，包含了在同一個(gè) Select 對(duì)象下的 Option 對(duì)象。Option 對(duì)象由“<select>”下的“<options>”指定。

options[] 數(shù)組的屬性
length; selectedIndex 與所屬 Select 對(duì)象的同名屬性相同。
單個(gè) Option 對(duì)象的屬性
text 返回/指定 Option 對(duì)象所顯示的文本
value 返回/指定 Option 對(duì)象的值，與<options value="...">一致。
index 返回該 Option 對(duì)象的下標(biāo)。對(duì)此并沒(méi)有什么好說(shuō)，因?yàn)橐付ㄌ囟ǖ囊粋€(gè) Option 對(duì)象，都要先知道該對(duì)象的下標(biāo)。這個(gè)屬性好像沒(méi)有什么用。
selected 返回/指定該對(duì)象是否被選中。通過(guò)指定 true 或者 false，可以動(dòng)態(tài)的改變選中項(xiàng)。
defaultSelected 返回該對(duì)象默認(rèn)是否被選中。true / false。

Submit 提交按鈕對(duì)象 由“<input type="submit">指定。因?yàn)?Submit 也是按鈕，所以也有 Button 對(duì)象的屬性和方法。至于“onclick”事件，一般用 Form 對(duì)象的 onsubmit 代替。
Text 文本框?qū)ο?/FONT> 由“<input type="text">”指定。Password 對(duì)象也是 Text 對(duì)象的一種，所以 Password 對(duì)象所有的屬性、方法和事件，Text 對(duì)象都有。
Textarea 多行文本輸入?yún)^(qū)對(duì)象 由“<textarea>”指定。Textarea 對(duì)象所有的屬性、方法和事件和 Text 對(duì)象相同，也就是跟 Password 對(duì)象一樣。
images[]; Image 圖片對(duì)象 document.images[] 是一個(gè)數(shù)組，包含了文檔中所有的圖片（<img>）。要引用單個(gè)圖片，可以用 document.images[x]。如果某圖片包含“name”屬性，也就是用“<img name="...">”這種格式定義了一幅圖片，就可以使用“document.images['...']”這種方法來(lái)引用圖片。在 IE 中，如果某圖片包含 ID 屬性，也就是用“<img id="...">”這種格式定義了一幅圖片，就可以直接使用“<imageID>”來(lái)引用圖片。

單個(gè) Image 對(duì)象的屬性
name; src; lowsrc; width; height; vspace; hspace; border 這些屬性跟<img>標(biāo)記里的同名屬性是一樣的。在 Netscape 里，除了 src 屬性，其它屬性（幾乎全部）都不能改的，即使改了，在文檔中也不能顯示出效果來(lái)。這些屬性最有用的就是 src 了，通過(guò)對(duì) src 屬性賦值，可以實(shí)時(shí)的更改圖片。
事件
onclick
不顯示在文檔中的 Image 對(duì)象
不顯示在文檔中的 Image 對(duì)象是用 var 語(yǔ)句定義的：

var myImage = new Image(); 或
var myImage = new Image(<圖片地址字符串>);
然后就可以像一般 Image 對(duì)象一樣對(duì)待 myImage 變量了。不過(guò)既然它不顯示在文檔中，以下屬性：lowsrc, width, height, vspace, hspace, border 就沒(méi)有什么用途了。一般這種對(duì)象只有一個(gè)用：預(yù)讀圖片(preload)。因?yàn)楫?dāng)對(duì)對(duì)象的 src 屬性賦值的時(shí)候，整個(gè)文檔的讀取、JavaScript 的運(yùn)行都暫停，讓瀏覽器專(zhuān)心的讀取圖片。預(yù)讀圖片以后，瀏覽器的緩存里就有了圖片的 Copy，到真正要把圖片放到文檔中的時(shí)候，圖片就可以立刻顯示了。現(xiàn)在的網(wǎng)頁(yè)中經(jīng)常會(huì)有一些圖像連接，當(dāng)鼠標(biāo)指向它的時(shí)候，圖像換成另外一幅圖像，它們都是先預(yù)讀圖像的。
預(yù)讀圖像的 JavaScript 例子

var imagePreload = new Image();
imagePreload.src = '001.gif';
imagePreload.src = '002.gif';
imagePreload.src = '003.gif';
以上例子適合預(yù)讀少量圖片。

function imagePreload() { var imgPreload = new Image(); for (i = 0; i < arguments.length; i++) { imgPreload.src = arguments[i]; } } imagePreload('001.gif', '002.gif', '003.gif', '004.gif', '005.gif');
以上例子適合預(yù)讀大量圖片。