Posted on 2010-06-13 18:51
幻海藍夢 閱讀(4389)
評論(2) 編輯 收藏 所屬分類:
JS
出處：http://hi.baidu.com/zrg8090/blog/item/2ed5dfefdbacbd252cf53426.html
一、DOM簡述
DOM—Document Object Model,它是W3C國際組織的一套Web標準。它定義了訪問HTML文檔對象的一套習(xí)屬性、方法和事件。
DOM是以層次結(jié)構(gòu)組織的節(jié)點或信息片斷的集合。文檔對象模型（Document Object Model）是給HTML與XML文件使用的一組API。DOM的本質(zhì)是建立網(wǎng)頁與腳本語言或程序語言溝通的橋梁。
瀏覽器對象是一個分層結(jié)構(gòu)，也稱為文檔對象模型，如下圖所示：
從上圖可以看出：
（1）打開網(wǎng)頁后，首先看到的是瀏覽器窗口，即頂層的window對象。
（2）其次，看到的是網(wǎng)頁文檔的內(nèi)容，即document文檔。
（3）定位對象：
window.document.myform.text1
或
document.myform.text1
因為window窗口對象是所有頁面的根對象，所以常常省略。
(4)地址對象location和歷史對象history，它他對應(yīng)IE瀏覽器中的地址欄和前進/后退按鈕。
二、窗口window
常用屬性：
1 window.clesed：指明窗口是否關(guān)閉。
2 window.defaultValue：窗口狀態(tài)欄的默認信息。
3 window.docement：表示瀏覽器窗口中的HTML文檔。
4 window.location：表示有關(guān)當前URL的信息。
5 window.history：表示有關(guān)當前訪問過的RUL的信息。
6 window.name：設(shè)置或檢索窗口或框架的名稱。
7 window.screen：包含有關(guān)客戶的屏幕和顯示性能的信息。
8 window.screenX：窗口X坐標
9 window.screenY：窗口Y坐標
10 window.status：設(shè)置或檢索窗口狀態(tài)欄中的信息。
11 window.title：設(shè)置或檢索窗口頂部標題欄中的信息。
12 window.self：當前窗口。
13 window.parent：當前窗口的最上層窗口。
14 window.top：當前顯示的窗口的最上層窗口。
15 window.opener：所打開“子窗口”的“父窗口”的名稱。
得到當前窗口的詳細信息：
JavaScript
常用方法：
1 window.alert(“提示信息”)：顯示一個包含確定按鈕的對話框。
2 window.blur()：使對象失去焦點并激發(fā)onblur事件。
3 window.close()：關(guān)閉窗口。
4 window.open(“打開窗口的url”,”窗口名”,”窗口特征”)：按指定特征打開窗口。
窗口特征參數(shù)如下:
height：窗口高度
width：窗口寬度
top：窗口距屏幕上方的象素值
left：窗口跟屏幕左側(cè)的象素值
toolbar：是否顯示工具欄，yes或1表示顯示，no或0表示不顯示。
menubar：是否顯示菜單欄，yes或1表示顯示，no或0表示不顯示。
scrollbars：是否顯示滾動欄，yes或1表示顯示，no或0表示不顯示。
resizable：是否允許改變窗口大小，yes或1表示否允，no或0表示不否允示。
location：是否顯示地址欄，yes或1表示顯示，no或0表示不顯示。
status：是否顯示狀態(tài)欄，yes或1表示顯示，no或0表示不顯示。
5 window.confirm(“提示信息”)：顯示一個確認對話框，包括確定和取消按鈕。當點確定按鈕時返回的是true,點取消按鈕時返回的是false。
6 window.prompt(“提示信息”,顯示在text中的默認值)：顯示帶輸入框提示對話框，主要用來收集信息。當點確定按鈕時返回的是true,點取消按鈕時返回的是false。
7 窗口定位的方法：
（1） window.moveBy(x,y)：實現(xiàn)窗口的定向、定量移動。兩個參數(shù)分別表示x方向移動的距離和y方向移動的距離。
（2） window.moveTo(x,y)：把窗口移動到指定坐標位置。兩個參數(shù)分別表示橫坐標、縱坐標。
8 窗口大小控制的兩個方法：（1）resizeBy(x,y)：按指定的尺寸調(diào)整窗口的大小。兩個參數(shù)分別表示在水平方向上的改變量和垂直方向上的改變量。
（2）resizeTo(x,y)：把窗口調(diào)整到指定尺寸。兩個參數(shù)分別表示瀏覽器窗口的寬和高。
9 操作定時器的兩個方法：
（1）setTimeout(“函數(shù)’,毫秒數(shù))：設(shè)置定時器，經(jīng)過指定毫秒值后執(zhí)行某個函數(shù)。
（2）clearTimeout(定時器對象)：取消某個定時器。
三、歷史對象history
主要屬性：
1 window.history.length:得到瀏覽器歷史清單中的項目個數(shù)。
主要方法：
1 window.history.back():加載History列表中的上一個URL，相當于IE的后退按鈕。等同于window.history.go(-1);
2 window.history.forward():加載History列表中的下一個URL，相當于IE的前進按鈕。等同于window.history.go(1);
3 go(“url” or number):加載History列表中的一個URL，或要求瀏覽器移動指定的頁面數(shù)。
四、地址對象location
此對象相當于IE瀏覽器中的地址欄,包含了關(guān)于當前URL地址的信息.它提供了一種重新加載當前URL的方法。主要屬性：
1 window.location.hash：設(shè)置或檢索另一個頁面里的錨
2 window.location.host：設(shè)置或檢索URL的主機名和端口號
3 window.location.hostname：設(shè)置或檢索URL的主機名部分
4 window.location.pathname：設(shè)置或檢索URL相對路徑
5 window.location.href：設(shè)置或檢索完整的URL字符串（常用）
6 window.location.port：設(shè)置或檢索主機端口號
主要方法：
1 assign(“url”)：加載URL指定的新的HTML文檔。
2 reload()：重新加載當前頁。
3 replace(“url”)：通過加載URL指定的文檔來替換當前文檔。
五、文檔對象DocumentDocument對象表示給定瀏覽器窗口中的HTML文檔，并用于檢索文檔的信息、檢查和修改HTML元素和文檔中的文本、以及處理事件。
主要屬性：
1 alinkColor：設(shè)置或獲取元素中所有激活鏈接的顏色2 linkColor：設(shè)置或獲取對象文檔鏈接的顏色。3 vlinkColor：設(shè)置或獲取用戶已訪問過的鏈接顏色。4 URL：設(shè)置或獲取當前文檔的 URL。5 location:獲取當前URL的信息。6 title：設(shè)置或獲取當前文檔的標題。7 protocol：設(shè)置或獲取 URL 的協(xié)議部分。8 readyState：獲取表明對象當前狀態(tài)的值。9 alinkColor：設(shè)置或獲取元素中所有激活鏈接的顏色。10 bgColor：設(shè)置或獲取表明對象后面的背景顏色的值。11 fgColor：設(shè)置或獲取文檔的前景(文本)顏色。12 all：返回對象所包含的元素集合的引用。13 anchors：獲取所有帶有 name 和/或 id 屬性的 a 對象的集合。此集合中的對象以 HTML 源順序排列。14 applets：獲取文檔中所有 applet 對象的集合。15 childNodes：獲取作為指定對象直接后代的 HTML 元素和 TextNode 對象的集合。16 embeds：獲取文檔中所有 embed 對象的集合。17 forms：獲取以源順序排列的文檔中所有 form 對象的集合。18 frames：獲取給定文檔定義或與給定窗口關(guān)聯(lián)的文檔定義的所有 window 對象的集合。19 images：獲取以源順序排列的文檔中所有 img 對象的集合。20 links：獲取文檔中所有指定了 HREF 屬性的 a 對象和所有 area 對象的集合。21 namespaces：獲取 namespace 對象的集合。22 scripts：獲取文檔中所有 script 對象的集合。23 styleSheets：獲取代表與文檔中每個 link 或 style 對象的實例相對應(yīng)的樣式表的 styleSheet 對象的集合。
主要方法：1 clear(): 清除當前文檔。2 close(): 關(guān)閉輸出流并強制將數(shù)據(jù)發(fā)送到顯示。3 write("text"): 在指定窗口的文檔中寫入一個或多個 HTML 表達式。4 writeln("text"): 在指定窗口的文檔中寫入一個或多個 HTML 表達式，后面追加一個換行符。5 focus(): 使得元素得到焦點并執(zhí)行由 onfocus 事件指定的代碼。6 hasFocus():獲取表明對象目前是否擁有焦點的值。7 getElementById("ID "):8 getElementsByName("Name "):9 getElementsByTagName(“TagName”):