摘要:對象的作用對象作為訪問和更新頁面內(nèi)容的入口。這個結(jié)果充分地說明了對象在的標準規(guī)范中代表整個頁面。對象的繼承鏈對象是繼承于對象的。對象也是的標準規(guī)范中非常重要的對象之一,而對象又是繼承于對象。
Document 對象是 DOM 的標準規(guī)范中比較重要的對象之一。該對象提供了訪問和更新 HTML 頁面內(nèi)容的屬性和方法。
Document 對象的作用Document 對象作為 DOM 訪問和更新 HTML 頁面內(nèi)容的入口。簡單來說,我們可以把 Document 對象理解為在 DOM 的標準規(guī)范中代表 HTML 頁面。(當然,這種說法并不準確)
Document 對象提供的屬性和方法,可以實現(xiàn)定位 HTML 頁面中的元素,或者創(chuàng)建新的元素等功能。
測試 Document 對象我們可以通過 console.log 方法將 Document 對象打印,測試 Document 對象中提供了哪些屬性和方法:
console.log(document);
運行 HTML 頁面后,打開 開發(fā)者工具,我們可以看到以下內(nèi)容:
我們會發(fā)現(xiàn) console 會將 HTML 頁面的源代碼打印出來。這個結(jié)果充分地說明了 Document 對象在 DOM 的標準規(guī)范中代表整個 HTML 頁面。
換句話講,DOM 訪問和更新 HTML 頁面內(nèi)容主要依靠 Document 對象作為入口。
Document 對象的屬性和方法一覽在 DOM 的標準規(guī)范中,Document 對象的屬性和方法被定義在了 prototype 原型中。所以,我們想要查看 Document 對象中具有哪些屬性和方法,可以打印 Document 對象的 protoype 進行查看。
console.log(Document.prototype);
運行 HTML 頁面后,打開 開發(fā)者工具,我們可以看到以下內(nèi)容:
URL:(...) activeElement:(...) adoptNode:function adoptNode() anchors:(...) append:function append() applets:(...) baseURI:(...) body:(...) characterSet:(...) charset:(...) childElementCount:(...) childNodes:(...) children:(...) close:function close() contentType:(...) cookie:(...) createAttribute:function createAttribute() createElement:function createElement() createEvent:function createEvent() createExpression:function createExpression() createNSResolver:function createNSResolver() createNodeIterator:function createNodeIterator() createProcessingInstruction:function createProcessingInstruction() createRange:function createRange() createTextNode:function createTextNode() createTreeWalker:function createTreeWalker() currentScript:(...) defaultView:(...) designMode:(...) dir:(...) doctype:(...) documentElement:(...) documentURI:(...) domain:(...) firstChild:(...) firstElementChild:(...) fonts:(...) forms:(...) getElementById:function getElementById() getElementsByClassName:function getElementsByClassName() getElementsByName:function getElementsByName() getElementsByTagName:function getElementsByTagName() getSelection:function getSelection() hasFocus:function hasFocus() head:(...) hidden:(...) images:(...) implementation:(...) importNode:function importNode() inputEncoding:(...) isConnected:(...) lastChild:(...) lastElementChild:(...) lastModified:(...) links:(...) nextSibling:(...) nodeName:(...) nodeType:(...) nodeValue:(...) open:function open() ownerDocument:(...) parentElement:(...) parentNode:(...) prepend:function prepend() previousSibling:(...) querySelector:function querySelector() querySelectorAll:function querySelectorAll() readyState:(...) referrer:(...) registerElement:function registerElement() rootElement:(...) scripts:(...) scrollingElement:(...) selectedStylesheetSet:(...) styleSheets:(...) textContent:(...) title:(...) visibilityState:(...) write:function write() writeln:function writeln()
我們可以看到,Document 對象提供的屬性和方法還是比較多的。但在實際開發(fā)中,比較常用的屬性和方法并沒有太多。
Document 對象的繼承鏈關(guān)于 Document 對象的具體用法,我們在后面的章節(jié)中學習。
Document 對象是繼承于 Node 對象的。Node 對象也是 DOM 的標準規(guī)范中非常重要的對象之一,而 Node 對象又是繼承于 EventTarget 對象。
我們可以通過以下代碼來測試 Document 對象的繼承鏈:
console.log(Document.prototype instanceof Node); console.log(Node.prototype instanceof EventTarget); console.log(Document.prototype instanceof EventTarget);
Document 對象的屬性和方法多是繼承于 Node 對象和 EventTarget 對象的。當然,也有一部分屬性和方法是實現(xiàn)了 HTMLDocument 接口的。
本教程免費開源,任何人都可以免費學習、分享,甚至可以進行修改。但需要注明作者及來源,并且不能用于商業(yè)。
本教程采用知識共享署名-非商業(yè)性使用-禁止演繹 4.0 國際許可協(xié)議進行許可。
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/87129.html
摘要:對象的作用樹結(jié)構(gòu)主要是依靠節(jié)點進行解析,稱為節(jié)點樹結(jié)構(gòu)。對象的繼承鏈關(guān)系對象是繼承于對象的,是一個用于接收事件的對象。但需要注明作者及來源,并且不能用于商業(yè)。本教程采用知識共享署名非商業(yè)性使用禁止演繹國際許可協(xié)議進行許可。 DOM 的標準規(guī)范中提供了 Node 對象,該對象主要提供了用于解析 DOM 節(jié)點樹結(jié)構(gòu)的屬性和方法。 Node 對象的作用 DOM 樹結(jié)構(gòu)主要是依靠節(jié)點進行解析,...
摘要:對象提供了可以創(chuàng)建元素節(jié)點屬性節(jié)點和文本節(jié)點的方法,方便更新頁面中的元素。是返回值,表示創(chuàng)建的元素。最后,通過方法創(chuàng)建屬性節(jié)點,并設(shè)置了屬性值為,再將該屬性節(jié)點添加到新創(chuàng)建的元素中。 Document 對象提供了可以創(chuàng)建元素節(jié)點、屬性節(jié)點和文本節(jié)點的方法,方便 DOM 更新 HTML 頁面中的元素。 創(chuàng)建元素節(jié)點 Document 對象提供了 createElement() 方法創(chuàng)建元...
摘要:對象提供了屬性和方法實現(xiàn)定位頁面元素功能,這也是的標準規(guī)范中對象的主要應(yīng)用之一。是返回值,表示定位元素的集合,是一個集合。定位匹配選擇器的第一個元素。方法定位頁面元素所返回的集合就是靜態(tài)集合。 Document 對象提供了屬性和方法實現(xiàn)定位頁面元素功能,這也是 DOM 的標準規(guī)范中 Document 對象的主要應(yīng)用之一。 定位頁面元素方法 目前 Document 對象提供實現(xiàn)定位頁面元...
摘要:對象中提供了和分別可以用于獲取指定節(jié)點的節(jié)點名稱節(jié)點類型和節(jié)點的值。具體的語法結(jié)構(gòu)如下在上述語法結(jié)構(gòu)中,是一個整數(shù),其代表的是節(jié)點類型。本教程采用知識共享署名非商業(yè)性使用禁止演繹國際許可協(xié)議進行許可。 Node 對象中提供了 nodeName、nodeType 和 nodeValue 分別可以用于獲取指定節(jié)點的節(jié)點名稱、節(jié)點類型和節(jié)點的值。 DOM 節(jié)點樹結(jié)構(gòu)中,我們實際開發(fā)最常見的節(jié)...
摘要:系列教程是一套免費開源,任何人都可以免費學習分享,甚至可以進行修改。本文是這套系列教程的索引也就是目錄第一回介紹在最開始,我們先來了解是什么的作用,以及瀏覽器的支持是怎么樣的。 《EASYDOM》系列教程是一套免費、開源,任何人都可以免費學習、分享,甚至可以進行修改。但需要注明作者及來源,并且不能用于商業(yè)。 本文是這套系列教程的索引(也就是目錄): 第一回 DOM 介紹 在最開始,我...
閱讀 808·2021-11-24 09:38
閱讀 1010·2021-11-11 11:01
閱讀 3255·2021-10-19 13:22
閱讀 1542·2021-09-22 15:23
閱讀 2844·2021-09-08 09:35
閱讀 2780·2019-08-29 11:31
閱讀 2134·2019-08-26 11:47
閱讀 1578·2019-08-26 11:44