This domain exposes DOM read/write operations. Each DOM Node is represented with its mirror object that has an id. This id can be used to get additional information on the Node, resolve it into the JavaScript object wrapper, etc. It is important that client receives DOM events only for the nodes that are known to the client. Backend keeps track of the nodes that were sent to the client and never sends the same node twice. It is client's responsibility to collect information about the nodes that were sent to the client.
Note that iframe owner elements will return corresponding document elements as their child nodes.
Commands
DOM.getAttributes
request: {
"id": <number>,
"method": "DOM.getAttributes",
"params": {
"
nodeId": <
NodeId>
}
}
response: {
"id": <number>,
"error": <object>,
"result": {
"
attributes": <array of string>
}
}
Returns attributes for the specified node.
Parameters
nodeId
Id of the node to retrieve attibutes for.
Returns
attributes
(
array of string
)
An interleaved array of node attribute names and values.
DOM.getDocument
request: {
"id": <number>,
"method": "DOM.getDocument"
}
response: {
"id": <number>,
"error": <object>,
"result": {
"
root": <
Node>
}
}
Returns the root DOM node to the caller.
Returns
DOM.getOuterHTML
request: {
"id": <number>,
"method": "DOM.getOuterHTML",
"params": {
"
nodeId": <
NodeId>
}
}
response: {
"id": <number>,
"error": <object>,
"result": {
"
outerHTML": <string>
}
}
Returns node's HTML markup.
Parameters
nodeId
Id of the node to get markup for.
Returns
outerHTML
(
string
)
Outer HTML markup.
DOM.hideHighlight
request: {
"id": <number>,
"method": "DOM.hideHighlight"
}
response: {
"id": <number>,
"error": <object>
}
Hides DOM node highlight.
DOM.highlightNode
request: {
"id": <number>,
"method": "DOM.highlightNode",
"params": {
"
highlightConfig": <
HighlightConfig>,
"
nodeId": <
NodeId>
}
}
response: {
"id": <number>,
"error": <object>
}
Highlights DOM node with given id or with the given JavaScript object wrapper. Either nodeId or objectId must be specified.
Parameters
highlightConfig
A descriptor for the highlight appearance.
nodeId
Identifier of the node to highlight.
DOM.highlightRect
request: {
"id": <number>,
"method": "DOM.highlightRect",
"params": {
"
x": <integer>,
"
y": <integer>,
"
width": <integer>,
"
height": <integer>,
"
color": <
RGBA>,
"
outlineColor": <
RGBA>
}
}
response: {
"id": <number>,
"error": <object>
}
Highlights given rectangle. Coordinates are absolute with respect to the main frame viewport.
Parameters
x
(
integer
)
X coordinate
y
(
integer
)
Y coordinate
width
(
integer
)
Rectangle width
height
(
integer
)
Rectangle height
color
The highlight fill color (default: transparent).
outlineColor
The highlight outline color (default: transparent).
DOM.moveTo
request: {
"id": <number>,
"method": "DOM.moveTo",
"params": {
"
nodeId": <
NodeId>,
"
targetNodeId": <
NodeId>,
"
insertBeforeNodeId": <
NodeId>
}
}
response: {
"id": <number>,
"error": <object>,
"result": {
"
nodeId": <
NodeId>
}
}
Moves node into the new container, places it before the given anchor.
Parameters
nodeId
Id of the node to drop.
targetNodeId
Id of the element to drop into.
insertBeforeNodeId
Drop node before given one.
Returns
nodeId
New id of the moved node.
DOM.querySelector
request: {
"id": <number>,
"method": "DOM.querySelector",
"params": {
"
nodeId": <
NodeId>,
"
selector": <string>
}
}
response: {
"id": <number>,
"error": <object>,
"result": {
"
nodeId": <
NodeId>
}
}
Executes querySelector on a given node.
Parameters
nodeId
Id of the node to query upon.
selector
(
string
)
Selector string.
Returns
nodeId
Query selector result.
DOM.querySelectorAll
request: {
"id": <number>,
"method": "DOM.querySelectorAll",
"params": {
"
nodeId": <
NodeId>,
"
selector": <string>
}
}
response: {
"id": <number>,
"error": <object>,
"result": {
"
nodeIds": <array of
NodeId>
}
}
Executes querySelectorAll on a given node.
Parameters
nodeId
Id of the node to query upon.
selector
(
string
)
Selector string.
Returns
nodeIds
Query selector result.
DOM.removeAttribute
request: {
"id": <number>,
"method": "DOM.removeAttribute",
"params": {
"
nodeId": <
NodeId>,
"
name": <string>
}
}
response: {
"id": <number>,
"error": <object>
}
Removes attribute with given name from an element with given id.
Parameters
nodeId
Id of the element to remove attribute from.
name
(
string
)
Name of the attribute to remove.
DOM.removeNode
request: {
"id": <number>,
"method": "DOM.removeNode",
"params": {
"
nodeId": <
NodeId>
}
}
response: {
"id": <number>,
"error": <object>
}
Removes node with given id.
Parameters
nodeId
Id of the node to remove.
DOM.requestChildNodes
request: {
"id": <number>,
"method": "DOM.requestChildNodes",
"params": {
"
nodeId": <
NodeId>
}
}
response: {
"id": <number>,
"error": <object>
}
Requests that children of the node with given id are returned to the caller in form of setChildNodes events where not only immediate children are retrieved, but all children down to the specified depth.
Parameters
nodeId
Id of the node to get children for.
DOM.requestNode
request: {
"id": <number>,
"method": "DOM.requestNode",
"params": {
"
objectId": <
Runtime.RemoteObjectId>
}
}
response: {
"id": <number>,
"error": <object>,
"result": {
"
nodeId": <
NodeId>
}
}
Requests that the node is sent to the caller given the JavaScript node object reference. All nodes that form the path from the node to the root are also sent to the client as a series of setChildNodes notifications.
Parameters
objectId
JavaScript object id to convert into node.
Returns
nodeId
Node id for given object.
DOM.resolveNode
request: {
"id": <number>,
"method": "DOM.resolveNode",
"params": {
"
nodeId": <
NodeId>,
"
objectGroup": <string>
}
}
response: {
"id": <number>,
"error": <object>,
"result": {
"
object": <
Runtime.RemoteObject>
}
}
Resolves JavaScript node object for given node id.
Parameters
nodeId
Id of the node to resolve.
objectGroup
(
optional
string
)
Symbolic group name that can be used to release multiple objects.
Returns
object
JavaScript object wrapper for given node.
DOM.setAttributeValue
request: {
"id": <number>,
"method": "DOM.setAttributeValue",
"params": {
"
nodeId": <
NodeId>,
"
name": <string>,
"
value": <string>
}
}
response: {
"id": <number>,
"error": <object>
}
Sets attribute for an element with given id.
Parameters
nodeId
Id of the element to set attribute for.
name
(
string
)
Attribute name.
value
(
string
)
Attribute value.
DOM.setAttributesAsText
request: {
"id": <number>,
"method": "DOM.setAttributesAsText",
"params": {
"
nodeId": <
NodeId>,
"
text": <string>,
"
name": <string>
}
}
response: {
"id": <number>,
"error": <object>
}
Sets attributes on element with given id. This method is useful when user edits some existing attribute value and types in several attribute name/value pairs.
Parameters
nodeId
Id of the element to set attributes for.
text
(
string
)
Text with a number of attributes. Will parse this text using HTML parser.
name
(
optional
string
)
Attribute name to replace with new attributes derived from text in case text parsed successfully.
DOM.setNodeName
request: {
"id": <number>,
"method": "DOM.setNodeName",
"params": {
"
nodeId": <
NodeId>,
"
name": <string>
}
}
response: {
"id": <number>,
"error": <object>,
"result": {
"
nodeId": <
NodeId>
}
}
Sets node name for a node with given id.
Parameters
nodeId
Id of the node to set name for.
name
(
string
)
New node's name.
Returns
DOM.setNodeValue
request: {
"id": <number>,
"method": "DOM.setNodeValue",
"params": {
"
nodeId": <
NodeId>,
"
value": <string>
}
}
response: {
"id": <number>,
"error": <object>
}
Sets node value for a node with given id.
Parameters
nodeId
Id of the node to set value for.
value
(
string
)
New node's value.
DOM.setOuterHTML
request: {
"id": <number>,
"method": "DOM.setOuterHTML",
"params": {
"
nodeId": <
NodeId>,
"
outerHTML": <string>
}
}
response: {
"id": <number>,
"error": <object>
}
Sets node HTML markup, returns new node id.
Parameters
nodeId
Id of the node to set markup for.
outerHTML
(
string
)
Outer HTML markup to set.
Notifications
DOM.attributeModified
{
"method": "DOM.attributeModified",
"params": {
"nodeId": <
NodeId>,
"name": <string>,
"value": <string>
}
}
Fired when Element's attribute is modified.
Parameters
nodeId
Id of the node that has changed.
name
(
string
)
Attribute name.
value
(
string
)
Attribute value.
DOM.attributeRemoved
{
"method": "DOM.attributeRemoved",
"params": {
"nodeId": <
NodeId>,
"name": <string>
}
}
Fired when Element's attribute is removed.
Parameters
nodeId
Id of the node that has changed.
name
(
string
)
A ttribute name.
DOM.characterDataModified
{
"method": "DOM.characterDataModified",
"params": {
"nodeId": <
NodeId>,
"characterData": <string>
}
}
Mirrors DOMCharacterDataModified event.
Parameters
nodeId
Id of the node that has changed.
characterData
(
string
)
New text value.
DOM.childNodeCountUpdated
{
"method": "DOM.childNodeCountUpdated",
"params": {
"nodeId": <
NodeId>,
"childNodeCount": <integer>
}
}
Fired when Container's child node count has changed.
Parameters
nodeId
Id of the node that has changed.
childNodeCount
(
integer
)
New node count.
DOM.childNodeInserted
{
"method": "DOM.childNodeInserted",
"params": {
"parentNodeId": <
NodeId>,
"previousNodeId": <
NodeId>,
"node": <
Node>
}
}
Mirrors DOMNodeInserted event.
Parameters
parentNodeId
Id of the node that has changed.
previousNodeId
If of the previous siblint.
DOM.childNodeRemoved
{
"method": "DOM.childNodeRemoved",
"params": {
"parentNodeId": <
NodeId>,
"nodeId": <
NodeId>
}
}
Mirrors DOMNodeRemoved event.
Parameters
nodeId
Id of the node that has been removed.
DOM.documentUpdated
{
"method": "DOM.documentUpdated"
}
Fired when Document has been totally updated. Node ids are no longer valid.
DOM.setChildNodes
{
"method": "DOM.setChildNodes",
"params": {
"parentId": <
NodeId>,
"nodes": <array of
Node>
}
}
Fired when backend wants to provide client with the missing DOM structure. This happens upon most of the calls requesting node ids.
Parameters
parentId
Parent node id to populate with children.
Types
HighlightConfig: object
borderColor
The border highlight fill color (default: transparent).
contentColor
The content box highlight fill color (default: transparent).
marginColor
The margin highlight fill color (default: transparent).
paddingColor
The padding highlight fill color (default: transparent).
showInfo
(
optional
boolean
)
Whether the node info tooltip should be shown (default: false).
Node: object
attributes
(
optional
array of string
)
Attributes of the Element node in the form of flat array [name1, value1, name2, value2].
childNodeCount
(
optional
integer
)
Child count for Container nodes.
children
(
optional
array of
Node
)
Child nodes of this node when requested with children.
contentDocument
Content document for frame owner elements.
documentURL
(
optional
string
)
Document URL that Document or FrameOwner node points to.
internalSubset
(
optional
string
)
DocumentType's internalSubset.
localName
(
string
)
Node's localName.
name
(
optional
string
)
Attr's name.
nodeId
Node identifier that is passed into the rest of the DOM messages as the nodeId. Backend will only push node with given id once. It is aware of all requested nodes and will only fire DOM events for nodes known to the client.
nodeName
(
string
)
Node's nodeName.
nodeType
(
integer
)
Node's nodeType.
nodeValue
(
string
)
Node's nodeValue.
publicId
(
optional
string
)
DocumentType's publicId.
systemId
(
optional
string
)
DocumentType's systemId.
value
(
optional
string
)
Attr's value.
xmlVersion
(
optional
string
)
Document's XML version in case of XML documents.
RGBA: object
a
(
optional
number
)
The alpha component, in the [0-1] range (default: 1).
b
(
integer
)
The blue component, in the [0-255] range.
g
(
integer
)
The green component, in the [0-255] range.
r
(
integer
)
The red component, in the [0-255] range.
