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
的一个引用。Element
that 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
HTMLCollection
containing all objects of typeElement
that are children of thisParentNode
. ParentNode.firstElementChild
只读- Returns the
Element
that is the first child of thisParentNode
, ornull
if there is none. ParentNode.lastElementChild
只读- Returns the
Element
that is the last child of thisParentNode
, ornull
if there is none. ParentNode.childElementCount
只读- Returns an
unsigned long
giving 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
pointerlockchange
event. Document.onpointerlockerror
- Returns the event handling code for the
pointerlockerror
event. Document.onreadystatechange
- Returns the event handling code for the
readystatechange
event.
方法
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
CaretPosition
based on two coordinates. Document.createAttribute(String name)
- Creates a new
Attr
object 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
NodeIterator
object. Document.createProcessingInstruction(String target, String data)
- Creates a new
ProcessingInstruction
object. Document.createRange()
- Creates a
Range
object. Document.createTextNode(String text)
- Creates a text node.
Document.createTreeWalker(Node root[, Number whatToShow[, NodeFilter filter]])
- Creates a
TreeWalker
object. 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
XPathExpression
which can then be used for (repeated) evaluations. Document.createNSResolver(Node resolver)
- Creates an
XPathNSResolver
object. 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
Selection
object related to text selected in the document. Document.hasFocus()
- Returns
true
if 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 Document extension. |
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 Document interface |
CSS Object Model (CSSOM) View Module Document |
Working Draft | Extend the Document interface |
CSS Object Model (CSSOM) Document |
Working Draft | Extend the Document interface |
Pointer Lock Document |
Candidate Recommendation | Extend the Document interface |
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
nsIURI
object 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
Node
interface in theDocument
interface:
document.contains
- As a work-around,
document.body.contains()
can be used.