src @Operator
virtual This add(Elem child)

Add a new element as a child to this element. Return this.

src This addAll(Elem[] elems)

Add all elements to this element. Returns this.

src Void animateStart(KeyFrames frames, [Str:Obj]? opts, Duration dur)

Start an animation on this element using the given key frames.

frames := KeyFrames([
  KeyFrame("0%",   ["transform": "scale(1)"]),
  KeyFrame("50%",  ["transform": "scale(1.1)"]),
  KeyFrame("100%", ["transform": "scale(1)"]),
])

animate(frames, null, 5sec)
animate(frames, ["animation-iteration-count":"infinite"], 1sec)

src Void animateStop()

Stop the current animation on this element, or do nothing if no animation in progress.

src Str? attr(Str name)

Get the given HTML attribute value for this element. Returns null if attribute not defined.

src Str:Str attrs()

Get name:value map of all attributes.

src virtual Void blur()

Remove focus from this elem.

src Elem[] children()

Get the child nodes of this element.

src Elem clone(Bool deep := true)

Return a duplicate of this node.

src Elem? closest(Str selectors)

Traverses this element and its parents (heading toward the document root) until it finds a node that matches the specified CSS selector. Returns null if none found.

src Bool containsChild(Elem elem)

Return true if given element is a descendant of this node, or false if not.

src virtual Bool? enabled

The enabled attribute for this element, or null if one not applicable. This is typically only valid for form elements.

src Elem? firstChild()

Get the first child node of this element, or null if this element has no children.

src virtual Void focus()

Request keyboard focus on this elem.

src static Elem fromHtml(Str html)

Create an Elem instance from a HTML string. This is equivlaent

elem := Elem { it.html=html }.firstChild

src @Js
static Elem fromNative(Obj elem, Type type := dom::Elem#)

Create an Elem instance from a native JavaScript DOM object. The type may be specified to create a subclass instance of Elem. Note if the native instance has already been mapped to Fantom, the existing instance is returned and type will have no effect.

src @Operator
Obj? get(Str name)

Convenience for attr.

src Bool hasChildren()

Return true if children is non-zero, false otherwise.

src virtual Bool hasFocus()

Return true if this elem has focus.

src Str html

The HTML markup contained in this element.

src Str? id

The id for this element. Returns null if id is not defined.

src virtual This insertBefore(Elem child, Elem ref)

Insert a new element as a child to this element before the specified reference element. The reference element must be a child of this element. Returns this.

src Obj? invoke(Str name, Obj?[]? args := null)

Invoke the given native DOM function with optional arguments.

src Elem? lastChild()

Get the last child node of this element, or null if this element has no children.

src new make(Str tagName := "div", Uri? ns := null)

Create a new Elem in the current Doc. Optionally a namespace can be specified with ns.

src Elem? nextSibling()

Get the next sibling to this element, or null if this is the last element under its parent.

src Uri ns()

The namespace URI of this element.

src Func onEvent(Str type, Bool useCapture, |Event| handler)

Attach an event handler for the given event on this element. Returns callback function instance.

src Point pagePos()

Position of element relative to the whole document.

src Elem? parent()

Get the parent Elem of this element, or null if this element has no parent.

src Point pos

Position of element relative to its parent in pixels.

src Elem? prevSibling()

Get the previous sibling to this element, or null if this is the first element under its parent.

src Obj? prop(Str name)

Get the given DOM property value for this element. Returns null if property does not exist.

src Elem? querySelector(Str selectors)

Returns the first element that is a descendant of this element on which it is invoked that matches the specified group of selectors.

src Elem[] querySelectorAll(Str selectors)

Returns a list of all elements descended from this element on which it is invoked that match the specified group of CSS selectors.

src Point relPos(Point p)

Given a page position, return p relative to this element.

src virtual This remove(Elem child)

Remove a child element from this element. Return this.

src This removeAll()

Remove all children from this element. Returns this.

src This removeAttr(Str name)

Remove the given HTML attribute from this element.

src Void removeEvent(Str type, Bool useCapture, Func handler)

Remove the given event handler from this element. If this handler was not registered, this method does nothing.

src Void renderCanvas(|Graphics| f)

Paint a <canvas> element. The given callback is invoked with a graphics context to perform the rendering operation.

src virtual This replace(Elem oldChild, Elem newChild)

Replace existing child node with a new child. Returns this.

src This scrollIntoView(Bool alignToTop := true)

Scroll parent container so this Elem is visible to user. If alignToTop is true (the default value), the top of Elem is aligned to top of the visible area. If false, the bottom of Elem is aligned to bottom of the visible area.

src Point scrollPos

Top left scroll position of element.

src Size scrollSize()

Scrollable size of element.

src @Operator
Void set(Str name, Str? val)

Conveneince for setAttr.

src This setAttr(Str name, Str? val, Uri? ns := null)

Set the given HTML attribute value for this element. If val is null the attribute is removed (see removeAttr). Optionally a namespace can be specified with ns.

src This setProp(Str name, Obj? val)

Set the given DOM properity value for this element.

src Size size

Size of element in pixels.

src Style style()

Get the Style instance for this element.

src Str tagName()

Get the tag name for this element.

src Str text

Text content contained in this element.

src Void transition(Str:Obj props, [Str:Obj]? opts, Duration dur, |Elem|? onComplete := null)

Transition a set of CSS properties.

transition(["opacity": "0.5"], null, 1sec) { echo("done!") }
transition(["opacity": "0.5"], ["transition-delay": 500ms], 1sec) { echo("done!") }

src virtual override Obj? trap(Str name, Obj?[]? args := null)

The trap operator will behave slightly differently based on the namespace of the element.

For HTML elements, trap works as a convenience for prop and setProp:

div := Elem("div")
div->tabIndex = 0   // equivalent to div.setProp("tabIndex", 0)

For SVG elements (where ns is `http://www.w3.org/2000/svg`), trap routes to attr and setAttr:

svg := Svg.line(0, 0, 10, 10)
svg->x1 = 5      // equivalent to svg.setAttr("x1", "5")
svg->y1 = 5      // equivalent to svg.setAttr("y1", "5")
svg->x2 == "10"  // equivalent to svg.attr("x2")