Common JavaScript methods

Purpose

Several UI components and containers share some JavaScript methods. Rather than list them repeatedly for each component.

Common UI components

The following methods define an interface that is common to most UI components.

_bindToDOM(...)

Binds the component instance to elements in the DOM. The arguments depend on both the component as well as the protocol. It is an error if this method is called more than once.

Note:

This function is deprecated and will be removed from a later version of MCS.

Parameter Description Type
... An implementation dependent set of arguments. any[]
outer()

Returns the outermost element of all nodes owned by the component. This method should be used when the component is being inserted as a child of another element.

Note:

The returned element encapsulates the whole structure of the component, but the actual document structure of the component rooted at this element is an implementation detail and could change from one device to another, or from one MCS version to another. Therefore, a custom JavaScript code must not attempt to navigate this structure or rely on it in anyway. If page authors break this rule, then it is their responsibility to fix any issues that arise as a result of implementation changes.

Note:

The getRoot() method is deprecated. The method was used for two distinct and in many cases mutually exclusive purposes: to access the outer element of a component when the component was being inserted as a child of another element, and to access the inner element of a component in order to dynamically manage the children of that component on the client. Both use cases relied on the fact that each component was represented by a single element. This is no longer true, and therefore the getRoot() method was replaced by the outer() and inner() methods.

Common UI containers

A common UI container is a common UI component that allows page author to directly manage the child elements of the component using client-side scripting. The following methods extend the common UI component interface.

inner()

Returns the innermost element of all nodes owned by the component. This method should be used when additional elements are being added inside the element.

Related topics