W3C DOM Compatibility - Core - mobile

Last major update on 25 May 2009.

Desktop table.

Vodafone

This series of compatibility tests is sponsored by Vodafone.

These compatibility tables detail support for the W3C DOM Core Level 1 and 2 modules in mobile browsers.

  1. Creating elements; HTML elements or text nodes.
  2. Several ways of getting elements.
  3. Node information. Once you found a node you need more information about it.
  4. Walking the DOM tree. How to go from one node to another.
  5. Node manipulation. How to move nodes through the document.
  6. Manipulating data. Data is always text, and there are some specialized methods for dealing with it.
  7. Manipulating attributes. Terrible browser incompatibilities.
  8. Miscellaneous methods and properties. You'll rarely need one of them.

Creating elements

These two methods create new HTML elements which you can then insert into the document.

Selector Opera Mobile Opera Mini 4.2 S60v3 WebKit S60v5 WebKit Default WebKits Non-default WebKits NetFront Blackberry IE Mobile Skyfire Obigo
(VF WM) Nokia E66 (9.5) HTC Touch Diamond (8.65) SE P1i (8.00) Motorola V3xx Nokia E71 Nokia E66 Nokia E71 Samsung i560 Nokia 5800 iPhone Android G1 Android G2 Bolt (E71) Iris (HTC) Ozone (E71) Samsung F700 Sony Ericsson C510 Blackberry 9500 HTC Touch Diamond Nokia E71 LG
createElement()
Create a new element

Test page
Yes Yes Yes Yes To be tested To be tested To be tested
var x = document.createElement('P')
Create a new HTML element node <P> and temporarily place it in x, which is later inserted into the document.
  • Opera < 9 and NetFront also support ('<P>').
createTextNode()
Create a new text node

Test page
Yes Yes Yes Yes To be tested To be tested To be tested
var x = document.createTextNode('text')

Create a text node with content text and temporarily place it in x, which is later inserted into the document.

Getting elements

These methods are meant for getting the HTML elements you need from the document.

You must know these methods by heart.

Selector Opera Mobile Opera Mini 4.2 S60v3 WebKit S60v5 WebKit Default WebKits Non-default WebKits NetFront Blackberry IE Mobile Skyfire Obigo
(VF WM) Nokia E66 (9.5) HTC Touch Diamond (8.65) SE P1i (8.00) Motorola V3xx Nokia E71 Nokia E66 Nokia E71 Samsung i560 Nokia 5800 iPhone Android G1 Android G2 Bolt (E71) Iris (HTC) Ozone (E71) Samsung F700 Sony Ericsson C510 Blackberry 9500 HTC Touch Diamond Nokia E71 LG
getElementById()
Get the element with this ID

Test page Lower case 'd'!!
Yes Almost Yes Yes Yes Yes To be tested To be tested To be tested
var x = document.getElementById('test')

Take the element with id="test" (wherever it is in the document) and put it in x.

If there is more than one element with id="test", the method selects the first in the document. All others are ignored.

  • Opera < 9 also returns the element with name="test".
getElementsByClassName()
Get a nodeList of the elements with this class.

Test page
Yes No Yes No Yes No No To be tested To be tested To be tested
document.getElementsByClassName('test')
document.getElementsByClassName('test test2')

The first expression returns a nodeList with all elements that have a class value that contains "test". The second one returns a nodeList will all elements that have a class value that contains both "test" and "test2" (in any order).

getElementsByTagName()
Get all tags of this type

Test page
Yes Yes Yes Yes To be tested To be tested To be tested
var x = document.getElementsByTagName('P')

Make x into a nodeList of all P's in the document, so x[1] is the second P etc.

var x = y.getElementsByTagName('P')

Gets all paragraphs that are descendants of node y.

querySelectorAll()
Get a nodeList of elements by CSS selector

Test page
No Yes No Yes No No To be tested To be tested To be tested
document.querySelectorAll('.testClass')
document.querySelectorAll('.testClass + p')

Returns a nodeList with all elements that have a class value that contains "testClass"; or a nodeList with all paragraphs directly following such an element.

Essentially, this method allows you to use CSS syntax to retrieve elements.

Selector Opera Mobile Opera Mini 4.2 S60v3 WebKit S60v5 WebKit Default WebKits Non-default WebKits NetFront Blackberry IE Mobile Skyfire Obigo
(VF WM) Nokia E66 (9.5) HTC Touch Diamond (8.65) SE P1i (8.00) Motorola V3xx Nokia E71 Nokia E66 Nokia E71 Samsung i560 Nokia 5800 iPhone Android G1 Android G2 Bolt (E71) Iris (HTC) Ozone (E71) Samsung F700 Sony Ericsson C510 Blackberry 9500 HTC Touch Diamond Nokia E71 LG

Node information

These four properties give basic information about all nodes. What they return depends on the node type. They are read-only, except for nodeValue.

There are three basic node types: element nodes (HTML tags), attribute nodes and text nodes. I test these properties for all these three types and added a fourth node type: the document node (the root of all other nodes).

You must know these properties by heart.

Selector Opera Mobile Opera Mini 4.2 S60v3 WebKit S60v5 WebKit Default WebKits Non-default WebKits NetFront Blackberry IE Mobile Skyfire Obigo
(VF WM) Nokia E66 (9.5) HTC Touch Diamond (8.65) SE P1i (8.00) Motorola V3xx Nokia E71 Nokia E66 Nokia E71 Samsung i560 Nokia 5800 iPhone Android G1 Android G2 Bolt (E71) Iris (HTC) Ozone (E71) Samsung F700 Sony Ericsson C510 Blackberry 9500 HTC Touch Diamond Nokia E71 LG
nodeName
The name of the node in UPPER CASE

Test page
Yes Yes Yes Yes To be tested To be tested To be tested
x.nodeName

The name of node x. The correct names are:

Element Attribute Text Comments Document
the UPPER CASE tag name the attribute name #text #comment #document
nodeType
The type of the node

Test page
Yes Yes Yes Yes To be tested To be tested To be tested
x.nodeType

The type of node x. The correct types are:

Element Attribute Text Comments Document
1 2 3 8 9
Selector Opera Mobile Opera Mini 4.2 S60v3 WebKit S60v5 WebKit Default WebKits Non-default WebKits NetFront Blackberry IE Mobile Skyfire Obigo
(VF WM) Nokia E66 (9.5) HTC Touch Diamond (8.65) SE P1i (8.00) Motorola V3xx Nokia E71 Nokia E66 Nokia E71 Samsung i560 Nokia 5800 iPhone Android G1 Android G2 Bolt (E71) Iris (HTC) Ozone (E71) Samsung F700 Sony Ericsson C510 Blackberry 9500 HTC Touch Diamond Nokia E71 LG
nodeValue
The value of the node, if any. Read/write

Test page
Yes Almost Yes Yes Almost Yes Yes Almost Almost To be tested To be tested To be tested
x.nodeValue

Get the value of node x

x.nodeValue = 'Test'

Set the value of node x

Element Attribute Text Comments Document
n/a Value of attribute Content of text node Content of comment node n/a
  • Opera 8, S60 WebKit on Samsung, NetFront on SE, and Blackberry return // for a comment.
tagName
The tag name of an element node

Test page Don't use
Yes Yes Yes Yes To be tested To be tested To be tested
x.tagName

Get the tag name of node x. Correct values are:

Element Attribute Text Comments Document
the UPPER CASE tag name n/a n/a n/a n/a

My advice is not to use tagName at all.
nodeName contains all functionalities of tagName, plus a few more. Therefore nodeName is always the better choice.

Selector Opera Mobile Opera Mini 4.2 S60v3 WebKit S60v5 WebKit Default WebKits Non-default WebKits NetFront Blackberry IE Mobile Skyfire Obigo
(VF WM) Nokia E66 (9.5) HTC Touch Diamond (8.65) SE P1i (8.00) Motorola V3xx Nokia E71 Nokia E66 Nokia E71 Samsung i560 Nokia 5800 iPhone Android G1 Android G2 Bolt (E71) Iris (HTC) Ozone (E71) Samsung F700 Sony Ericsson C510 Blackberry 9500 HTC Touch Diamond Nokia E71 LG

The DOM tree

Five properties and two arrays for walking through the DOM tree. Using these properties, you can reach nodes that are close to the current node in the document structure.

In general you shouldn't use too many of these properties. As soon as you're doing something like

x.parentNode.firstChild.nextSibling.children[2]

your code is too complicated. Complex relationships between nodes can suddenly and unexpectedly change when you alter the document structure, and altering the document structure is the point of the W3C DOM. In general you should use only one or two of these properties per action.

You must know these properties by heart.

Selector Opera Mobile Opera Mini 4.2 S60v3 WebKit S60v5 WebKit Default WebKits Non-default WebKits NetFront Blackberry IE Mobile Skyfire Obigo
(VF WM) Nokia E66 (9.5) HTC Touch Diamond (8.65) SE P1i (8.00) Motorola V3xx Nokia E71 Nokia E66 Nokia E71 Samsung i560 Nokia 5800 iPhone Android G1 Android G2 Bolt (E71) Iris (HTC) Ozone (E71) Samsung F700 Sony Ericsson C510 Blackberry 9500 HTC Touch Diamond Nokia E71 LG
childNodes[]
An array with all child nodes of the node

Test page
Yes Almost Yes Yes Almost Yes Almost Almost To be tested To be tested To be tested
x.childNodes[1]

Get the second child node of node x.

The childNodes nodeList consists of all child nodes of the element, including (empty) text nodes and comment nodes.

  • Blackberry, NetFront, Opera 8.00, and S60 WebKit on Samsung do not count empty text nodes.
children[]
An array with all child element nodes of the node

Test page
Yes Yes Yes No To be tested To be tested To be tested
x.children[1]

Get the second element child node of node x.

Where childNodes holds all child nodes, children only holds those that are element nodes (HTML tags).

firstChild
The first child node of the node

Test page
Yes Yes Yes Yes To be tested To be tested To be tested
x.firstChild

Get the first child node of node x.

lastChild
The last child node of the node

Test page
Yes Yes Yes Yes To be tested To be tested To be tested
x.lastChild

Get the last child of node x.

Selector Opera Mobile Opera Mini 4.2 S60v3 WebKit S60v5 WebKit Default WebKits Non-default WebKits NetFront Blackberry IE Mobile Skyfire Obigo
(VF WM) Nokia E66 (9.5) HTC Touch Diamond (8.65) SE P1i (8.00) Motorola V3xx Nokia E71 Nokia E66 Nokia E71 Samsung i560 Nokia 5800 iPhone Android G1 Android G2 Bolt (E71) Iris (HTC) Ozone (E71) Samsung F700 Sony Ericsson C510 Blackberry 9500 HTC Touch Diamond Nokia E71 LG
nextSibling
The next sibling node of the node

Test page
Yes Yes Yes Yes To be tested To be tested To be tested
x.nextSibling

Get the next child of the parent of x.

parentNode
The parent node of the node

Test page
Yes Yes Yes Yes To be tested To be tested To be tested
x.parentNode

Get the parent node of x.

previousSibling
The previous sibling node of the node

Test page
Yes Yes Yes Yes To be tested To be tested To be tested
x.previousSibling

Get the previous child of the parent of x.

sourceIndex
The index number of the node in the page source

Test page
Yes No No No To be tested To be tested To be tested
x.sourceIndex

Get the sourceIndex of element x. This is also the index number for the element in the document.getElementsByTagName('*') array.

Selector Opera Mobile Opera Mini 4.2 S60v3 WebKit S60v5 WebKit Default WebKits Non-default WebKits NetFront Blackberry IE Mobile Skyfire Obigo
(VF WM) Nokia E66 (9.5) HTC Touch Diamond (8.65) SE P1i (8.00) Motorola V3xx Nokia E71 Nokia E66 Nokia E71 Samsung i560 Nokia 5800 iPhone Android G1 Android G2 Bolt (E71) Iris (HTC) Ozone (E71) Samsung F700 Sony Ericsson C510 Blackberry 9500 HTC Touch Diamond Nokia E71 LG

Node manipulation

These five methods allow you to restructure the document. The average DOM script uses at least two of these methods.

The changes in the document structure are applied immediately, the whole DOM tree is altered. The browser, too, will immediately show the changes.

You must know these methods by heart.

Blackberry Incomplete: The Blackberry browser does not execute these tests correctly. However, I have evidence that appendChild() and insertBefore() are supported correctly in other circumstances, and I assume the same goes for removeChild() and replaceChild(). The only thing the Blackberry doesn’t execute correctly are these tests themselves.

Opera 8.00 on Motorola: I assume these methods work. I can’t test them because this Opera is locked in mobile mode, which means the test elements don’t have a border and I can’t see whether they behave correctly.

Selector Opera Mobile Opera Mini 4.2 S60v3 WebKit S60v5 WebKit Default WebKits Non-default WebKits NetFront Blackberry IE Mobile Skyfire Obigo
(VF WM) Nokia E66 (9.5) HTC Touch Diamond (8.65) SE P1i (8.00) Motorola V3xx Nokia E71 Nokia E66 Nokia E71 Samsung i560 Nokia 5800 iPhone Android G1 Android G2 Bolt (E71) Iris (HTC) Ozone (E71) Samsung F700 Sony Ericsson C510 Blackberry 9500 HTC Touch Diamond Nokia E71 LG
appendChild()
Append a child node as the last node to an element

Test page
Yes Yes Yes Incomplete To be tested To be tested To be tested
x.appendChild(y)

Make node y the last child of node x.

If you append a node that's somewhere else in the document, it moves to the new position.

cloneNode()
Clone a node

Test page
Yes Yes Yes Yes To be tested To be tested To be tested
x = y.cloneNode(true | false)

Make node x a copy of node y. If the argument is true, the entire tree below y is copied, if it's false only the root node y is copied.

Later you insert the clone into the document.

insertBefore()
Insert a node into the child nodes of an element

Test page
Yes Yes Yes Incomplete To be tested To be tested To be tested
x.insertBefore(y,z)

Insert node y as a child of node x just before node z.

removeChild()
Remove a child node from an element

Test page
Yes Yes Yes Incomplete To be tested To be tested To be tested
x.removeChild(y)

Remove child y of node x.

replaceChild()
Replace a child node of an element by another child node

Test page
Yes Yes Yes Incomplete To be tested To be tested To be tested
x.replaceChild(y,z)

Replace node z, a child of node x, by node y.

Selector Opera Mobile Opera Mini 4.2 S60v3 WebKit S60v5 WebKit Default WebKits Non-default WebKits NetFront Blackberry IE Mobile Skyfire Obigo
(VF WM) Nokia E66 (9.5) HTC Touch Diamond (8.65) SE P1i (8.00) Motorola V3xx Nokia E71 Nokia E66 Nokia E71 Samsung i560 Nokia 5800 iPhone Android G1 Android G2 Bolt (E71) Iris (HTC) Ozone (E71) Samsung F700 Sony Ericsson C510 Blackberry 9500 HTC Touch Diamond Nokia E71 LG

Text data

These methods are for manipulating text data, i.e. the contents of text nodes.

Selector Opera Mobile Opera Mini 4.2 S60v3 WebKit S60v5 WebKit Default WebKits Non-default WebKits NetFront Blackberry IE Mobile Skyfire Obigo
(VF WM) Nokia E66 (9.5) HTC Touch Diamond (8.65) SE P1i (8.00) Motorola V3xx Nokia E71 Nokia E66 Nokia E71 Samsung i560 Nokia 5800 iPhone Android G1 Android G2 Bolt (E71) Iris (HTC) Ozone (E71) Samsung F700 Sony Ericsson C510 Blackberry 9500 HTC Touch Diamond Nokia E71 LG
appendData()
Append data to a text node

Test page
Yes Yes To be tested Yes Yes To be tested To be tested To be tested
x.appendData(' some extra text')

Appends the string some extra text to x, which must be a text node.

data
The content of a text node

Test page
Yes Yes To be tested Yes Yes To be tested To be tested To be tested
x.data

The content of x, which must be a text node. The same as x.nodeValue.

Can also be set:

x.data = 'The new text'
deleteData()
Delete text from a text node

Test page
Yes Yes To be tested Yes Yes To be tested To be tested To be tested
x.deleteData(4,3)

Delete some data from x, which must be a text node, starting at the fifth character and deleting three characters. Second argument is required.

insertData()
Insert text into a text node

Test page
Yes Yes To be tested Yes Yes To be tested To be tested To be tested
x.insertData(4,' and now for some extra text ')

Insert the string and now for some extra text after the fourth character into x, which must be a text node.

normalize()
Merge adjacent text nodes into one node

Test page
Yes Yes To be tested Yes Yes To be tested To be tested To be tested
x.normalize()

All child nodes of node x that are text nodes and have other text nodes as siblings, are merged. This is in fact the reverse of splitText: text nodes that were split, come together again.

Selector Opera Mobile Opera Mini 4.2 S60v3 WebKit S60v5 WebKit Default WebKits Non-default WebKits NetFront Blackberry IE Mobile Skyfire Obigo
(VF WM) Nokia E66 (9.5) HTC Touch Diamond (8.65) SE P1i (8.00) Motorola V3xx Nokia E71 Nokia E66 Nokia E71 Samsung i560 Nokia 5800 iPhone Android G1 Android G2 Bolt (E71) Iris (HTC) Ozone (E71) Samsung F700 Sony Ericsson C510 Blackberry 9500 HTC Touch Diamond Nokia E71 LG
replaceData()
Replace text in a text node

Test page
Yes Yes To be tested Yes Yes To be tested To be tested To be tested
x.replaceData(4,3,' and for some new text ')

Replace three characters, beginning at the fifth one, of node x, which must be a text node, by the string and for some new text.

splitText()
Split a text node into two text nodes

Test page
Yes Yes To be tested Yes Yes To be tested To be tested To be tested
x.splitText(5)

Split the text node x at the 6th character. x now contains the first part (char. 0-5), while a new node is created (and becomes x.nextSibling) which contains the second part (char. 6-end) of the orginial text.

substringData()
Take a substring of the text in the text node

Test page
Yes Yes To be tested Yes Yes To be tested To be tested To be tested
x.substringData(4,3)

Takes a substring of x, which must be a text node, starting at the fifth character and with a length of three characters. Thus it's the same as the old substr() method of strings.

wholeText
The text of a text node plus the text in directly adjacent text nodes. Read only.

Test page
Yes No Yes No Yes To be tested No No To be tested To be tested To be tested

This read-only property is useful if you want to get the entire text at a certain point and don’t want to be bothered by borders between text nodes.

Selector Opera Mobile Opera Mini 4.2 S60v3 WebKit S60v5 WebKit Default WebKits Non-default WebKits NetFront Blackberry IE Mobile Skyfire Obigo
(VF WM) Nokia E66 (9.5) HTC Touch Diamond (8.65) SE P1i (8.00) Motorola V3xx Nokia E71 Nokia E66 Nokia E71 Samsung i560 Nokia 5800 iPhone Android G1 Android G2 Bolt (E71) Iris (HTC) Ozone (E71) Samsung F700 Sony Ericsson C510 Blackberry 9500 HTC Touch Diamond Nokia E71 LG

Attributes

A bloody mess. Try influencing attributes in this order:

  1. Try getting or setting a specific property, like x.id or y.onclick.
  2. If there is no specific property, use getAttribute() or setAttribute().
  3. If even that doesn't work, try any other method or property in the table below. Most have horrible browser incompatibility patterns, though.
  4. Avoid attributes[]. It's worse than anything else.

In my view any method or property concerning attribute nodes should also work on the style attribute, event handlers and custom attributes. If not I judge the method or property incomplete.

Selector Opera Mobile Opera Mini 4.2 S60v3 WebKit S60v5 WebKit Default WebKits Non-default WebKits NetFront Blackberry IE Mobile Skyfire Obigo
(VF WM) Nokia E66 (9.5) HTC Touch Diamond (8.65) SE P1i (8.00) Motorola V3xx Nokia E71 Nokia E66 Nokia E71 Samsung i560 Nokia 5800 iPhone Android G1 Android G2 Bolt (E71) Iris (HTC) Ozone (E71) Samsung F700 Sony Ericsson C510 Blackberry 9500 HTC Touch Diamond Nokia E71 LG
attributes[index]
An array with the attributes of a node, accessed by index number, in the order they're defined in the source code.

Test page Do not use Use getAttribute() instead
Yes Yes Yes Yes To be tested To be tested To be tested
x.attributes[1]

This array consists of all defined attributes in the source code order .

Do yourself a favour and don't use the indexed attributes array.

attributes[key]
An array with the attributes of a node, accessed by attribute name

Test page
Yes No Yes To be tested No Yes To be tested To be tested To be tested
x.attributes['align']

Get the align attribute object of node x. If the node has no align attribute, it returns undefined (except in IE, where it returns an attribute object that has no value.)

After years in the wilderness attribute[key] is slowly approaching a workable situation. I used to advice you not to use it; but by now you can try it if you like.

Selector Opera Mobile Opera Mini 4.2 S60v3 WebKit S60v5 WebKit Default WebKits Non-default WebKits NetFront Blackberry IE Mobile Skyfire Obigo
(VF WM) Nokia E66 (9.5) HTC Touch Diamond (8.65) SE P1i (8.00) Motorola V3xx Nokia E71 Nokia E66 Nokia E71 Samsung i560 Nokia 5800 iPhone Android G1 Android G2 Bolt (E71) Iris (HTC) Ozone (E71) Samsung F700 Sony Ericsson C510 Blackberry 9500 HTC Touch Diamond Nokia E71 LG
getAttribute()
Get the value of an attribute

Test page
Yes Yes To be tested Yes Yes To be tested To be tested To be tested
x.getAttribute('align')

Gives the value of the align attribute of node x. Upper case attribute names are also allowed.

getAttributeNode()
Get an attribute node

Test page
Yes Yes To be tested Yes Yes To be tested To be tested To be tested
x.getAttributeNode('align')

Get the attribute object align of node x. This is an object, not a value.

hasAttribute()
Check if a node has a certain attribute

Test page
Yes Yes To be tested Yes Yes To be tested To be tested To be tested
x.hasAttribute('align')

Returns true when node x has an align attribute, false when it hasn't.

hasAttributes()
Check if a node has attributes

Test page
Yes Yes To be tested Yes Yes To be tested To be tested To be tested
x.hasAttributes()

Returns true when node x has attributes, false when it hasn't.

name
The name of an attribute

Test page
Yes Yes Yes Yes To be tested To be tested To be tested
x.name

The name of attribute node x.

Selector Opera Mobile Opera Mini 4.2 S60v3 WebKit S60v5 WebKit Default WebKits Non-default WebKits NetFront Blackberry IE Mobile Skyfire Obigo
(VF WM) Nokia E66 (9.5) HTC Touch Diamond (8.65) SE P1i (8.00) Motorola V3xx Nokia E71 Nokia E66 Nokia E71 Samsung i560 Nokia 5800 iPhone Android G1 Android G2 Bolt (E71) Iris (HTC) Ozone (E71) Samsung F700 Sony Ericsson C510 Blackberry 9500 HTC Touch Diamond Nokia E71 LG
removeAttribute()
Remove an attribute node

Test page
Incomplete Yes Yes Yes To be tested To be tested To be tested
x.removeAttribute('align')

Remove the align attribute from node x.

  • Opera doesn't remove event handlers.
removeAttributeNode()
Remove an attribute node

Test page
Incomplete Yes Yes Yes To be tested To be tested To be tested
x.removeAttributeNode(x.attributes['align'])
x.removeAttributeNode(x.attributes[1])
x.removeAttributeNode(x.getAttributeNode('align'))

Removes the attribute node. There is little difference with removeAttribute(), except in the argument.

  • Opera doesn't remove event handlers.
setAttribute()
Set the value of an attribute

Test page
Yes Yes Yes Yes To be tested To be tested To be tested
x.setAttribute('align','right')

Set the align attribute of node x to right. The name and value are both strings.

value
The value of an attribute

Test page
Yes Yes Yes Yes To be tested To be tested To be tested
x.value

The value of attribute x.

Selector Opera Mobile Opera Mini 4.2 S60v3 WebKit S60v5 WebKit Default WebKits Non-default WebKits NetFront Blackberry IE Mobile Skyfire Obigo
(VF WM) Nokia E66 (9.5) HTC Touch Diamond (8.65) SE P1i (8.00) Motorola V3xx Nokia E71 Nokia E66 Nokia E71 Samsung i560 Nokia 5800 iPhone Android G1 Android G2 Bolt (E71) Iris (HTC) Ozone (E71) Samsung F700 Sony Ericsson C510 Blackberry 9500 HTC Touch Diamond Nokia E71 LG

Miscellaneous

A lot of miscellaneous methods and properties that you'll rarely need. I use only two of them in an actual script.

Selector Opera Mobile Opera Mini 4.2 S60v3 WebKit S60v5 WebKit Default WebKits Non-default WebKits NetFront Blackberry IE Mobile Skyfire Obigo
(VF WM) Nokia E66 (9.5) HTC Touch Diamond (8.65) SE P1i (8.00) Motorola V3xx Nokia E71 Nokia E66 Nokia E71 Samsung i560 Nokia 5800 iPhone Android G1 Android G2 Bolt (E71) Iris (HTC) Ozone (E71) Samsung F700 Sony Ericsson C510 Blackberry 9500 HTC Touch Diamond Nokia E71 LG
compareDocumentPosition()
Gives the relative place of one element compared to another.

Test page
Yes No Yes No Yes To be tested No No To be tested To be tested To be tested
x.compareDocumentPosition(y)

Compares the document (DOM) position of element y to that of element x The method returns a bitmask:

  • 1: Position disconnected
  • 2: Precedes
  • 4: Follows
  • 8: Contains
  • 16: Is contained by

All relevant numbers are added, and this sum is returned. So if y follows (4) and is contained by (16) x, the method returns 20.

contains()
Check whether an element contains another element

Test page
Yes Incorrect Yes To be tested Yes No To be tested To be tested To be tested
x.contains(y)

If node y is a descendant of node x, the method returns true, else false.

See this blog post for a Firefox workaround. (And yes, Firefox’s constant refusal to implement this very useful method is becoming extremely annoying.)

  • S60 WebKit always returns true, except when you ask if an element contains itself (should return true, oddly enough, but S60 WebKit returns false.
createDocumentFragment()
Create a document fragment

Test page
Yes Yes To be tested Yes Incomplete To be tested To be tested To be tested
x = document.createDocumentFragment();
x.[fill with nodes];
document.[somewhere].appendChild(x);

Create a fragment, add a lot of nodes to it, and then insert it into the document. Note that the fragment itself is not inserted, only its child nodes.

  • Blackberry doesn’t run the second test (where nodes are removed from the document to the fragment) correctly: it doesn’t insert the fragment, although the nodes are removed.
documentElement
The HTML tag

Test page
Yes Yes To be tested Yes Yes To be tested To be tested To be tested
document.documentElement

Represents the root element of the XML document. In any HTML document, the <html> element is of course the root element.

Selector Opera Mobile Opera Mini 4.2 S60v3 WebKit S60v5 WebKit Default WebKits Non-default WebKits NetFront Blackberry IE Mobile Skyfire Obigo
(VF WM) Nokia E66 (9.5) HTC Touch Diamond (8.65) SE P1i (8.00) Motorola V3xx Nokia E71 Nokia E66 Nokia E71 Samsung i560 Nokia 5800 iPhone Android G1 Android G2 Bolt (E71) Iris (HTC) Ozone (E71) Samsung F700 Sony Ericsson C510 Blackberry 9500 HTC Touch Diamond Nokia E71 LG
getElementsByName()
Get elements by their name attribute

Test page
Incorrect Incorrect and incomplete Incorrect Yes To be tested Yes Incomplete Yes To be tested To be tested To be tested
var x = document.getElementsByName('test')

Create a nodeList with all elements that have name="test". It should ignore elements with id="test"

On my test page the <p>, <input>, <img> and <ppk> tags have this name, while there's also a paragraph with id="test". Ideally, all browsers should get the first four elements and ignore the fifth one.

  • Opera 9 counts the <div> with id="test"
  • Opera 8 does the same, and doesn’t return the <p> and <ppk>.
  • NetFront SE C510 does not return the <ppk> tag.
hasChildNodes()
Check if the node has child nodes

Test page
Yes Yes To be tested Yes Yes To be tested To be tested To be tested
x.hasChildNodes()

Returns true when node x has child nodes; false when it hasn't.

item()
Access an item in an array

Test page Not necessary in JavaScript
Yes Yes To be tested Yes Yes To be tested To be tested To be tested
document.getElementsByTagName('P').item(0)

The same as document.getElementsByTagName('P')[0].

The item() method is meant for other programming languages where nodeLists like those returned by getElementsByTagName are not conveniently accessible as if they were arrays.

You don't need item() at all in JavaScript.

ownerDocument
The document that 'owns' the element

Test page
Yes Yes To be tested Yes Yes To be tested To be tested To be tested
x.ownerDocument

Refers to the document object that 'owns' node x. This is the document node.

Selector Opera Mobile Opera Mini 4.2 S60v3 WebKit S60v5 WebKit Default WebKits Non-default WebKits NetFront Blackberry IE Mobile Skyfire Obigo
(VF WM) Nokia E66 (9.5) HTC Touch Diamond (8.65) SE P1i (8.00) Motorola V3xx Nokia E71 Nokia E66 Nokia E71 Samsung i560 Nokia 5800 iPhone Android G1 Android G2 Bolt (E71) Iris (HTC) Ozone (E71) Samsung F700 Sony Ericsson C510 Blackberry 9500 HTC Touch Diamond Nokia E71 LG