Document類型

JavaScript通過Document類型表示文檔。在瀏覽器中，document對象是HTMLDocument(繼承自Document類型)的一個實例，document對象是window對象的一個屬性，因此可以將其作為全局對象來訪問。Document節點具有下列特征：

nodeType的值為9

nodeName的值為“#document”

nodeValue的值為null

parentNode的值為null

ownerDocument的值為null

其子節點可能是一個DocumentType、Element、ProcessingInstruction或者Comment

1、文檔的節點

有兩個內置的訪問其子節點的快捷方式。第一個就是documentElement屬性，該屬性始終指向HTML頁面中的元素。另一個就是通過childNodes列表訪問文檔元素，但通過documentElement屬性更快捷

1??????????2??????????????

3?4??????????????5??????????6?7??????????var?html?=?document.documentElement;8??????????console.log(html?===?document.childNOdes[0]);?//true9??????????console.log(html?===?document.firstChild);?//true

document對象還有一個body屬性，直接指向

元素。1?var?body?=?document.body;

所有瀏覽器都支持document.documentElement和document.body屬性

通常將標簽看成一個與文檔其他部分不同的實體，可以通過doctype屬性來訪問他的信息1?var?doctype?=?document.doctype;

瀏覽器對document.doctype的支持差別很大

2、文檔信息

作為HTMLDocument的一個實例，document對象還有一些標準的Document對象所沒有的屬性。其中第一個屬性就是title，包含著

中的文本，可以修改當前頁面的標題并反映在瀏覽器的窗口中1?????????//取得文檔標題2?????????var?originalTitle?=?document.title;3?????????//設置文檔標題4?????????document.title?=?"New?page?title";

URL、domain和referrer都和頁面的請求有關，URL屬性中包含完整的URL(即地址欄中的URL)。domain屬性中只包含頁面的域名，而referrer屬性中則保存著鏈接到當前頁面的那個頁面的URL。在沒有來源頁面的情況下，referrer屬性中可能會包含空字符串。

URL和doamin屬性是相互關聯的。例如，如果document.URL等于http://www.wrox.com/WileyCDA/，那么document.domain就等于www.wrox.com。

在這三個屬性中，只有domain屬性可以設置。由于安全的方面的限制，如果URL中包含一個子域名，例如p2p.wrox.com,那么就只能將domain設置為"wrox.com"。

3、查找元素

Document類型提供了兩個方法：getElementById()和getElementsByTagName()

getElementById(),接受一個參數：要取得元素的ID，如果找不到匹配的元素返回null,如果頁面中有多個相同的ID，則返回第一次出現的元素。

getElementsByTagName()，接受一個參數即要取得元素的標簽名，而返回的是包含零或多個元素的Nodelist。在HTML文檔中，這個方法會返回一個HTMLCollection對象，作為一個“動態”集合，改對象與Nodelist非常類似。1?????????var?images?=?document.getElementsByTagName('img');

這行代碼會將一個HTMLCollection對象保存在images變量中。與Nodelist對象類似，可以使用方括號語法或item()方法來訪問HTMLCollection對象中的項。而這個對象中元素的數量可以通過length屬性取得。1?????????console.log(images.length);//輸出圖像的數量2?????????console.log(images.item(0).src);//輸出第一個圖像的src屬性3?????????console.log(images[0].src);//輸出第一個圖像的src屬性

HTMLCollection對象還有一個方法，叫做namedItem(),使用這個方法可以通過元素的name特性取得集合中的項1?????????2?????????var?myImages?=?document.namedItem('myImages');

在提供按索引訪問項的基礎上，HTMLCollention還支持按名稱訪問項。而且對命名的項也可以使用方括號語法來訪問，例如：1?var?myimage?=?images['myImages'];

要想取得文檔中的所有元素，可以向getElementsByTagName()中傳入"*"。第一項是元素，第二項是

元素，以此類推。

第三個方法，也是只有HTMLCollection類型才有的方法，是getElementsByName()。這個方法會返回帶有給定name特性的所有元素。最常是有這個方法的情況是取得單選按鈕

4、特殊集合

document.anchors，包含文檔中所有帶name特性的元素，以此類推。

document.applets，包含文檔中所有元素。

document.forms，包含文檔中所有的

元素，與document.getElementsByTagName('form')得到的結果相同

document.images，包含文檔中所有元素，與document.getElementsByTagName('img')得到的結果相同

document.links,包含文檔中所有帶href特性的元素。

這個特殊集合始終都可以通過HTMLDocument對象訪問到，而且，與HTMLCollection對象類似，集合中的項也會隨著當前文檔內容的更新而更新。

5.DOM一致性檢測

由于DOM分為多個級別，也包含多個部分，因此檢測瀏覽器實現了DOM的哪些部分就十分必要了。document.implementation屬性就是為此提供相應信息和功能的對象，與瀏覽器對DOM的實現直接對應。DOM1級只為document.implementation規定了一個方法，即hansFrature()。這個方法接受兩個參數：要檢測的DOM功能的名稱以及版本號。如果瀏覽器支持給定的名稱和版本的功能，則該方法返回true，例如：1?var?hasXmlDom?=?document.implementation.hasFearure("XML",1.0);

6、文檔的寫入

有一個document對象的功能已經存在很多年了，那就是將輸出流寫入到網頁中的能力。這個能力體現在下列4個方法中：weite()、writeln()、open()和close()。其中，write()和writeln()方法都接受一個字符串參數，即要寫入到輸出流中的文本。write()會原樣寫入，而writeln()則會在字符串末尾添加一個換行符(\n)。例如：

1??????????????2?????????????

?3?????????????document.write()?Example?4??????????????5??????????????6?????????????????

The?current?data?and??time?is:?7?????????????????10?????????????????

11?????????????12?????????????

此外還可以使用write()和writeln()方法動態的包含外部資源，例如JavaScript文件等。注意：不能像下面的例子那樣直接包含字符串""，因為這會導致該字符串被解釋為腳本塊的結束，它后面的代碼將無法執行。

1??????????????2?????????????

?3?????????????document.write()?Example2?4??????????????5??????????????6?????????????????");?8??????????????????9?????????????10?????????????

即使這個文件看起來沒錯，但字符串""將被解釋為與外部的

1??????????????2?????????????

?3?????????????document.write()?Example2?4??????????????5??????????????6??????????????????9?????????????10?????????????

前面的例子使用document.write()在頁面被呈現的過程中直接向其中輸出了內容。如果在文檔加載結束后再調用document.write(),那么輸出的內容將會重寫整個頁面。

1??????????????2?????????????

?3?????????????document.write()?Example?4??????????????5??????????????6?????????????????

This?is?some?context?that?you?won't?get?to?see?because?it?will?be?overwritten.

?7?????????????????12?????????????13?????????????

等到頁面完全加載之后延遲執行函數。函數執行之后，字符串"Hello world!"會重寫這個頁面內容

方法open()和close()分別用于打開和關閉輸出流。如果是在頁面加載期間使用write()或writeln()方法，則不需要用到這兩個方法。

總結

以上是生活随笔為你收集整理的html页面设置document类型,DOM-Document类型的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。