Document 接口提供了一些在浏览器服务中作为页面内容入口点而加载的一些页面,也就是 DOM 树。 DOM 树包括诸如 <body> 和 <table> 之类的元素,及其他元素。其也为文档(document)提供了全局性的函数,例如获取页面的 URL、在文档中创建新的 element 的函数。
<div id="interfaceDiagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 11.666666666666666%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 70" preserveAspectRatio="xMinYMin meet"><a xlink:href="https://developer.mozilla.org/zh-CN/docs/Web/API/EventTarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">EventTarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#D4DDE4" fill="none"/><line x1="121" y1="25" x2="151" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/zh-CN/docs/Web/API/Node" target="_top"><rect x="151" y="1" width="75" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">Node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#D4DDE4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/zh-CN/docs/Web/API/Document" target="_top"><rect x="266" y="1" width="80" height="50" fill="#F4F7F8" stroke="#D4DDE4" stroke-width="2px" /><text x="306" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">Document</text></a></svg></div>
a:hover text { fill: #0095DD; pointer-events: all;}
Document接口描述了任何类型的文档的公共属性和方法。根据文档的类型 (例如 HTML、XML、SVG, ... ), 可以使用更大的API: HTML 文档, 以text / html内容类型提供, 也实现了HTMLDocument接口,而SVG 文档实现了 SVGDocument 接口。
属性
Document 接口也继承自 Node 及 EventTarget 接口。
Document.all- 通过id可对所有元素进行访问。 这是一个遗留的非标准接口,可以使用
Document.getElementById()方法来替代。 Document.async- 与
document.load一起使用,表示一个异步请求。 Document.characterSet只读- 返回文档使用的字符集。
Document.charset只读Document.characterSet的别名。使用本属性代替别名。Document.compatMode只读- 表示是在 Quirks 模式还是在 Strict 模式下渲染文档的。
Document.contentType只读- 从当前文档的 MIME 首部返回 Content-Type。
Document.doctype只读- 返回当前文档的 Document Type Definition (DTD)。
Document.documentElement只读- 返回 document 的直属后代元素。对于 HTML 文档来说,返回的一般是 HTML 元素。
Document.documentURI只读- 返回文档的 URL。
Document.domConfig- 会返回一个
DOMConfiguration对象。 Document.hidden只读- …
Document.implementation只读- 返回与当前文档相关联的 DOM implementation。
Document.inputEncoding只读Document.characterSet的别名。使用本属性替代Document.characterSet。Document.lastStyleSheetSet只读- 返回样式表集最后使用的名称。其初始值为
null,直到设置selectedStyleSheetSet的值改变这些样式表。 Document.mozSyntheticDocument当 document 是人造(synthetic)时,如一个独立的图像,视频,音频文件等,其值为 true。Document.mozFullScreen- 当 document 处于
full-screen mode时,其值为true。 Document.mozFullScreenElement只读- 当前 document 处于全屏模式下的元素。
Document.mozFullScreenEnabled只读假如在当前 document 调用element.mozRequestFullscreen()成功,其值为true。Document.pointerLockElement只读- 当指针被锁定时,返回元素集合,作为鼠标事件的目标。 如果锁被挂起,或指针解锁,或者目标是在另一个 document,则为 null。
Document.preferredStyleSheetSet只读- 返回网页设计人员所指定的首选样式表集。
Document.scrollingElement只读- 返回滚动 document 的
Element的一个引用。Elementthat scrolls the document. Document.selectedStyleSheetSet- 返回当前正在使用的样式表集。
Document.styleSheets只读- 返回当前 document 的样式表对象的列表。
Document.styleSheetSets只读- 返回当前 document 可用的样式表集的列表。
Document.timeline只读- …
Document.undoManager只读- …
Document.URL只读- 返回...
Document.visibilityState只读- …
Document.xmlEncoding- 返回 XML 声明所确定的编码。
Document.xmlStandalone已废弃 Gecko 10.0- 返回
true,如果 XML 声明指定该 document 是独立的(例如,document 的内容会受到一个 DTD 外部影响 ),否则为false。 Document.xmlVersion已废弃 Gecko 10.0- 返回指定 XML 声明的版本号,如果不存在版本号,则返回
"1.0"。
Document 接口是 ParentNode 接口的扩展:
ParentNode.children只读- Returns a live
HTMLCollectioncontaining all objects of typeElementthat are children of thisParentNode. ParentNode.firstElementChild只读- Returns the
Elementthat is the first child of thisParentNode, ornullif there is none. ParentNode.lastElementChild只读- Returns the
Elementthat is the last child of thisParentNode, ornullif there is none. ParentNode.childElementCount只读- Returns an
unsigned longgiving the amount of children that the object has.
扩展的HTML文档
HTML文档的 Document 接口继承自 HTMLDocument 接口或者说从 HTML5 之后扩展了下面这些文档:
Document.activeElement只读- 返回当前正在操作的元素
Document.alinkColor- 返回或者设置,document中的活动链接的颜色
Document.anchors- 返回当前 document 的所有的锚点的列表
Document.applets- 返回的 document 内的 applets 的有序列表
Document.bgColor- Gets/sets the background color of the current document.
Document.body- Returns the
<body>element of the current document. Document.cookie- Returns a semicolon-separated list of the cookies for that document or sets a single cookie.
Document.defaultView只读- Returns a reference to the window object.
Document.designMode- Gets/sets the ability to edit the whole document.
Document.dir只读- Gets/sets directionality (rtl/ltr) of the document.
Document.domain只读- Returns the domain of the current document.
Document.embeds只读- Returns a list of the embedded
<embed>elements within the current document. Document.fgColor- Gets/sets the foreground color, or text color, of the current document.
Document.forms只读- Returns a list of the
<form>elements within the current document. Document.head只读- Returns the
<head>element of the current document. Document.height- Gets/sets the height of the current document.
Document.images只读- Returns a list of the images in the current document.
Document.lastModified只读- Returns the date on which the document was last modified.
Document.linkColor- Gets/sets the color of hyperlinks in the document.
Document.links只读- Returns a list of all the hyperlinks in the document.
Document.location只读- Returns the URI of the current document.
Document.plugins只读- Returns a list of the available plugins.
Document.readyState只读- Returns loading status of the document.
Document.referrer只读- Returns the URI of the page that linked to this page.
Document.scripts只读- Returns all the
<script>elements on the document. Document.title- Returns the title of the current document.
Document.URL只读- Returns a string containing the URL of the current document.
Document.vlinkColor- Gets/sets the color of visited hyperlinks.
Document.width- Returns the width of the current document.
事件句柄
Document.onpointerlockchange- Returns the event handling code for the
pointerlockchangeevent. Document.onpointerlockerror- Returns the event handling code for the
pointerlockerrorevent. Document.onreadystatechange- Returns the event handling code for the
readystatechangeevent.
方法
Note: The Document interface also inherit from the Node and EventTarget interfaces.
Document.adoptNode(Node node)- Adopt node from an external document.
Document.captureEvents(String eventName)- See
window.captureEvents. Document.caretPositionFromPoint(Number x, Number y)- Gets a
CaretPositionbased on two coordinates. Document.createAttribute(String name)- Creates a new
Attrobject and returns it. Document.createAttributeNS(String namespace, String name)- Creates a new attribute node in a given namespace and returns it.
Document.createCDATASection(String data)- Creates a new CDATA node and returns it.
Document.createComment(String comment)- Creates a new comment node and returns it.
Document.createDocumentFragment()- Creates a new document fragment.
Document.createElement(String name)- Creates a new element with the given tag name.
Document.createElementNS(String namespace, String name)- Creates a new element with the given tag name and namespace URI.
Document.createEntityReference(String name)- Creates a new entity reference object and returns it.
Document.createEvent(String interface)- Creates an event object.
Document.createNodeIterator(Node root[, Number whatToShow[, NodeFilter filter]])- Creates a
NodeIteratorobject. Document.createProcessingInstruction(String target, String data)- Creates a new
ProcessingInstructionobject. Document.createRange()- Creates a
Rangeobject. Document.createTextNode(String text)- Creates a text node.
Document.createTreeWalker(Node root[, Number whatToShow[, NodeFilter filter]])- Creates a
TreeWalkerobject. Document.elementFromPoint(Number x, Number y)- Returns the element visible at the specified coordinates.
Document.enableStyleSheetsForSet(String name)- Enables the style sheets for the specified style sheet set.
Document.exitPointerLock()- Release the pointer lock.
Document.getElementsByClassName(String className)- Returns a list of elements with the given class name.
Document.getElementsByTagName(String tagName)- Returns a list of elements with the given tag name.
Document.getElementsByTagNameNS(String namespace, String tagName)- Returns a list of elements with the given tag name and namespace.
Document.importNode(Node node, Boolean deep)- Returns a clone of a node from an external document.
Document.normalizeDocument()- Replaces entities, normalizes text nodes, etc.
Document.releaseCapture()- Releases the current mouse capture if it's on an element in this document.
Document.releaseEvents- See
window.releaseEvents. document.routeEvent已废弃 Gecko 24- See
window.routeEvent. document.mozSetImageElement- Allows you to change the element being used as the background image for a specified element ID.
The Document interface is extended with the ParentNode interface:
Document.getElementById(String id)- Returns an object reference to the identified element.
Document.querySelector(String selector)- Returns the first Element node within the document, in document order, that matches the specified selectors.
Document.querySelectorAll(String selector)- Returns a list of all the Element nodes within the document that match the specified selectors.
The Document interface is extended with the XPathEvaluator interface:
Document.createExpression(String expression, XPathNSResolver resolver)- Compiles an
XPathExpressionwhich can then be used for (repeated) evaluations. Document.createNSResolver(Node resolver)- Creates an
XPathNSResolverobject. Document.evaluate(String expression, Node contextNode, XPathNSResolver resolver, Number type, Object result)- Evaluates an XPath expression.
扩展的HTML文档
HTML文档的 Document 接口继承自 HTMLDocument 接口或者说从 HTML5 之后扩展了下面这些文档:
Document.clear()- In majority of modern browsers, including recent versions of Firefox and Internet Explorer, this method does nothing.
Document.close()- Closes a document stream for writing.
Document.execCommand(String command[, Boolean showUI[, String value]])- On an editable document, executes a formating command.
Document.getElementsByName(String name)- Returns a list of elements with the given name.
Document.getSelection()- Returns a
Selectionobject related to text selected in the document. Document.hasFocus()- Returns
trueif the focus is currently located anywhere inside the specified document. Document.open()- Opens a document stream for writing.
Document.queryCommandEnabled(String command)- Returns true if the formating command can be executed on the current range.
Document.queryCommandIndeterm(String command)- Returns true if the formating command is in an indeterminate state on the current range.
Document.queryCommandState(String command)- Returns true if the formating command has been executed on the current range.
Document.queryCommandSupported(String command)- Returns true if the formating command is supported on the current range.
Document.queryCommandValue(String command)- Returns the current value of the current range for a formating command.
Document.write(String text)- Writes text to a document.
Document.writeln(String text)- Writes a line of text to a document.
Specifications
| Specification | Status | Comment |
|---|---|---|
| Document Object Model (DOM) Level 1 Specification Document |
Obsolete | Initial definition for the interface |
| Document Object Model (DOM) Level 2 Core Specification Document |
Obsolete | Supersede DOM 1 |
| Document Object Model (DOM) Level 3 Core Specification Document |
Obsolete | Supersede DOM 2 |
| DOM Document |
Living Standard | Intend to supersede DOM 3 |
| HTML Living Standard Document |
Living Standard | Turn the HTMLDocument interface into a Documentextension. |
| Document Object Model (DOM) Level 3 XPath Specification XPathEvaluator |
Recommendation | Define the XPathEvaluator interface which extendDocument. |
| HTML Editing APIs Document |
Editor's Draft | Extend the Documentinterface |
| CSS Object Model (CSSOM) View Module Document |
Working Draft | Extend the Documentinterface |
| CSS Object Model (CSSOM) Document |
Working Draft | Extend the Documentinterface |
| Pointer Lock Document |
Candidate Recommendation | Extend the Documentinterface |
Browser compatibility
Firefox notes
Mozilla define a set of non-standard properties made only for XUL content:
document.currentScript- Returns the
<script>element that is currently executing. document.documentURIObject- (Mozilla add-ons only!) Returns the
nsIURIobject representing the URI of the document. This property only has special meaning in privileged JavaScript code (with UniversalXPConnect privileges). document.popupNode- Returns the node upon which a popup was invoked.
document.tooltipNode- Returns the node which is the target of the current tooltip.
Mozilla also define some non-standard methods:
Document.execCommandShowHelp已废弃 Gecko 14.0- This method never did anything and always threw an exception, so it was removed in Gecko 14.0 (Firefox 14.0 / Thunderbird 14.0 / SeaMonkey 2.11).
Document.getBoxObjectFor- Use the
Element.getBoundingClientRect()method instead. Document.loadOverlay- Loads a XUL overlay dynamically. This only works in XUL documents.
document.queryCommandText已废弃 Gecko 14.0- This method never did anything but throw an exception, and was removed in Gecko 14.0 (Firefox 14.0 / Thunderbird 14.0 / SeaMonkey 2.11).
Internet Explorer notes
Microsoft defines some non-standard properties:
document.fileSize*- Returns size in bytes of the document. Starting with Internet Explorer 11, that property is no longer supported. See MSDN.
- Internet Explorer does not support all methods from the
Nodeinterface in theDocumentinterface:
document.contains- As a work-around,
document.body.contains()can be used.