DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JavaScript基礎知識 >> JavaScript入門教程(10) 認識其他對象
JavaScript入門教程(10) 認識其他對象
編輯:JavaScript基礎知識     

anchors[]; links[]; Link 連接對象
用法:document.anchors[[x]]; document.links[[x]]; <anchorId>; <linkId>
  document.anchors 是一個數組,包含了文檔中所有錨標記(包含 name 屬性的<a>標記),按照在文檔中的次序,從 0 開始給每個錨標記定義了一個下標。
  document.links 也是一個數組,包含了文檔中所有連接標記(包含 href 屬性的<a>標記和<map>標記段裡的<area>標記),按照在文檔中的次序,從 0 開始給每個連接標記定義了一個下標。
  如果一個<a>標記既有 name 屬性,又有 href 屬性,則它既是一個 Anchor 對象,又是一個 Link 對象。
  在 IE 中,如果在<a>標記中添加“id="..."”屬性,則這個<a>對象被賦予一個標識(ID),調用這個對象的時候只需要使用“<id>”就行了。很多文檔部件都可以用這個方法來賦予 ID,但要注意不能有兩個 ID 相同。
anchors 和 links 作為數組,有數組的屬性和方法。單個 Anchor 對象沒有屬性;單個 Link 對象的屬性見下。

屬性
protocol; hostname; port; host; pathname; hash; search; href 與 location 對象相同。
target
返回/指定連接的目標窗口(字符串),與<a>標記裡的 target 屬性是一樣的。
事件
onclick; onmouseover; onmouseout; onmousedown; onmouseup
applets[] Java小程序對象 它是一個數組,包含了文檔中所有的 Applet 對象(Java 小程序)。作為一個數組,有數組的屬性和方法。關於單個 Applet 對象的屬性和方法,我引用一句話:“Applet 對象繼承了 Java 小程序的所有公共屬性和方法。”(英文原句:The Applet object inherits all public properties of the Java applet./The Applet object inherits all public methodss of the Java applet.) 因為本人很厭惡 Java 小程序,所以對它的什麼“公共”“私有”的問題不感興趣,也就沒有探討了。
embeds[] 插件對象 它是一個數組,包含了文檔中所有的插件(<embed>標記)。因為每個插件的不同,每個 Embed 對象也有不同的屬性和方法。
forms[]; Form 表單對象 document.forms[] 是一個數組,包含了文檔中所有的表單(<form>)。要引用單個表單,可以用 document.forms[x],但是一般來說,人們都會這樣做:在<form>標記中加上“name="..."”屬性,那麼直接用“document.<表單名>”就可以引用了。
Form 對象的屬性
name 返回表單的名稱,也就是<form name="...">屬性。
action
返回/設定表單的提交地址,也就是<form action="...">屬性。
method 返回/設定表單的提交方法,也就是<form method="...">屬性。
target 返回/設定表單提交後返回的窗口,也就是<form target="...">屬性。
encoding 返回/設定表單提交內容的編碼方式,也就是<form enctype="...">屬性。
length 返回該表單所含元素的數目。
方法
reset() 重置表單。這與按下“重置”按鈕是一樣的。
submit() 提交表單。這與按下“提交”按鈕是一樣的。
事件
onreset; onsubmit
以下從“Button”到“Textarea”都是表單的元素對象。
Button 按鈕對象 由“<input type="button">”指定。引用一個 Button 對象,可以使用“<文檔對象>.<表單對象>.<按鈕名稱>”。<按鈕名稱>指在<input>標記中的“name="..."”屬性的值。引用任意表單元素都可以用這種方法。
屬性
name 返回/設定用<input name="...">指定的元素名稱。
value
返回/設定用<input value="...">指定的元素的值。
form 返回包含本元素的表單對象。
方法
blur() 從對象中移走焦點。
focus() 讓對象獲得焦點。
click() 模擬鼠標點擊該對象。
事件
onclick; onmousedown; onmouseup
Checkbox 復選框對象 由“<input type="checkbox">”指定。
屬性
name 返回/設定用<input name="...">指定的元素名稱。
value
返回/設定用<input value="...">指定的元素的值。
form 返回包含本元素的表單對象。
checked 返回/設定該復選框對象是否被選中。這是一個布爾值。
defaultChecked 返回/設定該復選框對象默認是否被選中。這是一個布爾值。
方法
blur() 從對象中移走焦點。
focus()
讓對象獲得焦點。
click() 模擬鼠標點擊該對象。
事件
onclick
elements[]; Element 表單元素對象 <表單對象>.elements 是一個數組,包含了該表單所有的對象。一般我們不用該數組,而直接引用各個具體的對象。
Hidden 隱藏對象 由“<input type="hidden">”指定。
屬性
name 返回/設定用<input name="...">指定的元素名稱。
value
返回/設定用<input value="...">指定的元素的值。
form
返回包含本元素的表單對象。
Password 密碼輸入區對象 由“<input type="password">”指定。
屬性
name 返回/設定用<input name="...">指定的元素名稱。
value
返回/設定密碼輸入區當前的值。
defaultValue
返回用<input value="...">指定的默認值。
form
返回包含本元素的表單對象。
方法
blur() 從對象中移走焦點。
focus()
讓對象獲得焦點。
select() 選中密碼輸入區裡全部文本。
事件
onchange
Radio 單選域對象 由“<input type="radio">”指定。一組 Radio 對象有共同的名稱(name 屬性),這樣的話,document.formName.radioName 就成了一個數組。要訪問單個 Radio 對象就要用:document.formName.radioName[x]。
單個 Radio 對象的屬性
name 返回/設定用<input name="...">指定的元素名稱。
value
返回/設定用<input value="...">指定的元素的值。
form
返回包含本元素的表單對象。
checked
返回/設定該單選域對象是否被選中。這是一個布爾值。
defaultChecked
返回/設定該對象默認是否被選中。這是一個布爾值。
方法
blur() 從對象中移走焦點。
focus()
讓對象獲得焦點。
click()
模擬鼠標點擊該對象。
事件
onclick
Reset 重置按鈕對象 由“<input type="reset">”指定。因為 Reset 也是按鈕,所以也有 Button 對象的屬性和方法。至於“onclick”事件,一般用 Form 對象的 onreset 代替。
Select 選擇區(下拉菜單、列表)對象 由“<select>”指定。
屬性
name 返回/設定用<input name="...">指定的元素名稱。
length
返回 Select 對象下選項的數目。
selectedIndex
返回被選中的選項的下標。這個下標就是在 options[] 數組中該選項的位置。如果 Select 對象允許多項選擇,則返回第一個被選中的選項的下標。
form
返回包含本元素的表單對象。
方法
blur() 從對象中移走焦點。
focus()
讓對象獲得焦點。
事件
onchange
options[]; Option 選擇項對象 options[] 是一個數組,包含了在同一個 Select 對象下的 Option 對象。Option 對象由“<select>”下的“<options>”指定。
options[] 數組的屬性
length; selectedIndex 與所屬 Select 對象的同名屬性相同。
單個 Option 對象的屬性
text 返回/指定 Option 對象所顯示的文本
value
返回/指定 Option 對象的值,與<options value="...">一致。
index
返回該 Option 對象的下標。對此並沒有什麼好說,因為要指定特定的一個 Option 對象,都要先知道該對象的下標。這個屬性好像沒有什麼用。
selected
返回/指定該對象是否被選中。通過指定 true 或者 false,可以動態的改變選中項。
defaultSelected 返回該對象默認是否被選中。true / false。
Submit 提交按鈕對象 由“<input type="submit">指定。因為 Submit 也是按鈕,所以也有 Button 對象的屬性和方法。至於“onclick”事件,一般用 Form 對象的 onsubmit 代替。
Text 文本框對象 由“<input type="text">”指定。Password 對象也是 Text 對象的一種,所以 Password 對象所有的屬性、方法和事件,Text 對象都有。
Textarea 多行文本輸入區對象 由“<textarea>”指定。Textarea 對象所有的屬性、方法和事件和 Text 對象相同,也就是跟 Password 對象一樣。
images[]; Image 圖片對象 document.images[] 是一個數組,包含了文檔中所有的圖片(<img>)。要引用單個圖片,可以用 document.images[x]。如果某圖片包含“name”屬性,也就是用“<img name="...">”這種格式定義了一幅圖片,就可以使用“document.images['...']”這種方法來引用圖片。在 IE 中,如果某圖片包含 ID 屬性,也就是用“<img id="...">”這種格式定義了一幅圖片,就可以直接使用“<imageID>”來引用圖片。
單個 Image 對象的屬性
name; src; lowsrc; width; height; vspace; hspace; border 這些屬性跟<img>標記裡的同名屬性是一樣的。在 Netscape 裡,除了 src 屬性,其它屬性(幾乎全部)都不能改的,即使改了,在文檔中也不能顯示出效果來。這些屬性最有用的就是 src 了,通過對 src 屬性賦值,可以實時的更改圖片。
事件
onclick
不顯示在文檔中的 Image 對象
不顯示在文檔中的 Image 對象是用 var 語句定義的:
var myImage = new Image(); 或
var myImage = new Image(<圖片地址字符串>);
然後就可以像一般 Image 對象一樣對待 myImage 變量了。不過既然它不顯示在文檔中,以下屬性:lowsrc, width, height, vspace, hspace, border 就沒有什麼用途了。一般這種對象只有一個用:預讀圖片(preload)。因為當對對象的 src 屬性賦值的時候,整個文檔的讀取、JavaScript 的運行都暫停,讓浏覽器專心的讀取圖片。預讀圖片以後,浏覽器的緩存裡就有了圖片的 Copy,到真正要把圖片放到文檔中的時候,圖片就可以立刻顯示了。現在的網頁中經常會有一些圖像連接,當鼠標指向它的時候,圖像換成另外一幅圖像,它們都是先預讀圖像的。
預讀圖像的 JavaScript 例子
var imagePreload = new Image();
imagePreload.src = '001.gif';
imagePreload.src = '002.gif';
imagePreload.src = '003.gif';
以上例子適合預讀少量圖片。
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');

以上例子適合預讀大量圖片。
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved