Login Register Help
API Documentation
Choose a stylesheet:
dojo ยป create

Functiondojo.create (returns DomNode)

dojo.require("dojo._base.html");

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.attr. See dojo.attr 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.

parametertypedescription
tagString|DomNodeA string of the element to create (eg: "div", "a", "p", "li", "script", "br"), or an existing DOM node to process.
attrsObjectAn 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.attr for a description of available attributes.
refNodeString|DomNodeOptional. 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.
posStringOptional. 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.

Usage

var foo: DomNode=dojo.create(tag: String|DomNode, attrs: Object, refNode: String|DomNode?, pos: String?);

Examples

Example 1

Create a DIV: var n = dojo.create(“div”);

Example 2

Create a DIV with content: var n = dojo.create(“div”, { innerHTML:”

hi

” });

Example 3

Place a new DIV in the BODY, with no attributes set var n = dojo.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”: var ul = dojo.create(“ul”, null, “someId”, “first”); var items = [“one”, “two”, “three”, “four”]; dojo.forEach(items, function(data){

dojo.create("li", { innerHTML: data }, ul);

});

Example 5

Create an anchor, with an href. Place in BODY: dojo.create(“a”, { href:”foo.html”, title:”Goto FOO!” }, dojo.body());

Example 6

Create a dojo.NodeList from a new element (for syntatic sugar):

dojo.query(dojo.create('div'))
    .addClass("newDiv")
    .onclick(function(e){ console.log('clicked', e.target) })
    .place("#someNode"); // redundant, but cleaner.