dojo/dom-construct

See the dojo/dom-construct reference documentation for more information.

Methods

create(tag,attrs,refNode,pos)

Defined by dojo/dom-construct

Create an element, allowing for optional attribute decoration and placement.

A DOM Element creation function. A shorthand method for creating a node or a fragment, and allowing for a convenient optional attribute setting step, as well as an optional DOM placement reference.

Attributes are set by passing the optional object through dojo.setAttr. See dojo.setAttr for noted caveats and nuances, and API if applicable.

Placement is done via dojo.place, assuming the new node to be the action node, passing along the optional reference node and position.

Parameter	Type	Description
tag	DOMNode | String	A string of the element to create (eg: "div", "a", "p", "li", "script", "br"), or an existing DOM node to process.
attrs	Object	An object-hash of attributes to set on the newly created node. Can be null, if you don't want to set any attributes/styles. See: dojo.setAttr for a description of available attributes.
refNode	DOMNode | String	Optional Optional reference node. Used by dojo.place to place the newly created node somewhere in the dom relative to refNode. Can be a DomNode reference or String ID of a node.
pos	String	Optional Optional positional reference. Defaults to "last" by way of dojo.place, though can be set to "first","after","before","last", "replace" or "only" to further control the placement of the new node relative to the refNode. 'refNode' is required if a 'pos' is specified.

Returns: undefined

Examples

Example 1

Create a DIV:

require(["dojo/dom-construct"], function(domConstruct){
    var n = domConstruct.create("div");
});

Example 2

Create a DIV with content:

require(["dojo/dom-construct"], function(domConstruct){
    var n = domConstruct.create("div", { innerHTML:"<p>hi</p>" });
});

Example 3

Place a new DIV in the BODY, with no attributes set

require(["dojo/dom-construct"], function(domConstruct){
    var n = domConstruct.create("div", null, dojo.body());
});

Example 4

Create an UL, and populate it with LI's. Place the list as the first-child of a node with id="someId":

require(["dojo/dom-construct", "dojo/_base/array"],
function(domConstruct, arrayUtil){
    var ul = domConstruct.create("ul", null, "someId", "first");
    var items = ["one", "two", "three", "four"];
    arrayUtil.forEach(items, function(data){
        domConstruct.create("li", { innerHTML: data }, ul);
    });
});

Example 5

Create an anchor, with an href. Place in BODY:

require(["dojo/dom-construct"], function(domConstruct){
    domConstruct.create("a", { href:"foo.html", title:"Goto FOO!" }, dojo.body());
});

destroy(node)

Defined by dojo/dom-construct

Removes a node from its parent, clobbering it and all of its children.

Removes a node from its parent, clobbering it and all of its children. Function only works with DomNodes, and returns nothing.

Parameter	Type	Description
node	DOMNode | String	A String ID or DomNode reference of the element to be destroyed

Examples

Example 1

Destroy a node byId:

require(["dojo/dom-construct"], function(domConstruct){
    domConstruct.destroy("someId");
});

empty(node)

Defined by dojo/dom-construct

safely removes all children of the node.

Parameter	Type	Description
node	DOMNode | String	a reference to a DOM node or an id.

Examples

Example 1

Destroy node's children byId:

require(["dojo/dom-construct"], function(domConstruct){
    domConstruct.empty("someId");
});

place(node,refNode,position)

Defined by dojo/dom-construct

Attempt to insert node into the DOM, choosing from various positioning options. Returns the first argument resolved to a DOM node.

Parameter	Type	Description
node	DOMNode | DocumentFragment | String	id or node reference, or HTML fragment starting with "<" to place relative to refNode
refNode	DOMNode | String	id or node reference to use as basis for placement
position	String | Number	Optional string noting the position of node relative to refNode or a number indicating the location in the childNodes collection of refNode. Accepted string values are: before after replace only first last "first" and "last" indicate positions as children of refNode, "replace" replaces refNode, "only" replaces all children. position defaults to "last" if not specified

Returns: DOMNode | undefined

Returned values is the first argument resolved to a DOM node.

.place() is also a method of dojo/NodeList, allowing dojo/query node lookups.

Examples

Example 1

Place a node by string id as the last child of another node by string id:

require(["dojo/dom-construct"], function(domConstruct){
    domConstruct.place("someNode", "anotherNode");
});

Example 2

Place a node by string id before another node by string id

require(["dojo/dom-construct"], function(domConstruct){
    domConstruct.place("someNode", "anotherNode", "before");
});

Example 3

Create a Node, and place it in the body element (last child):

require(["dojo/dom-construct", "dojo/_base/window"
], function(domConstruct, win){
    domConstruct.place("<div></div>", win.body());
});

Example 4

Put a new LI as the first child of a list by id:

require(["dojo/dom-construct"], function(domConstruct){
    domConstruct.place("<li></li>", "someUl", "first");
});

toDom(frag,doc)

Defined by dojo/dom-construct

instantiates an HTML fragment returning the corresponding DOM.

Parameter	Type	Description
frag	String	the HTML fragment
doc	DocumentNode	Optional optional document to use when creating DOM nodes, defaults to dojo/_base/window.doc if not specified.

Returns: any | undefined

Document fragment, unless it's a single node in which case it returns the node itself

Examples

Example 1

Create a table row:

require(["dojo/dom-construct"], function(domConstruct){
    var tr = domConstruct.toDom("<tr><td>First!</td></tr>");
});