class dom::Elem

sys::Obj
  dom::Elem

@Js

Source

Elem models a DOM element object.

See pod doc for details.

add

@Operator
virtual This add(Elem child)

Source

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

addAll

This addAll(Elem[] elems)

Source

Add all elements to this element. Returns this.

animateStart

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

Source

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)

animateStop

Void animateStop()

Source

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

attr

Str? attr(Str name)

Source

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

attrs

Str:Str attrs()

Source

Get name:value map of all attributes.

blur

virtual Void blur()

Source

Remove focus from this elem.

children

Elem[] children()

Source

Get the child nodes of this element.

clone

Elem clone(Bool deep := true)

Source

Return a duplicate of this node.

closest

Elem? closest(Str selectors)

Source

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.

containsChild

Bool containsChild(Elem elem)

Source

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

enabled

virtual Bool? enabled

Source

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

firstChild

Elem? firstChild()

Source

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

focus

virtual Void focus()

Source

Request keyboard focus on this elem.

fromHtml

static Elem fromHtml(Str html)

Source

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

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

fromNative

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

Source

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.

get

@Operator
Obj? get(Str name)

Source

Convenience for attr.

hasChildren

Bool hasChildren()

Source

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

hasFocus

virtual Bool hasFocus()

Source

Return true if this elem has focus.

html

Str html

Source

The HTML markup contained in this element.

id

Str? id

Source

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

insertBefore

virtual This insertBefore(Elem child, Elem ref)

Source

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.

invoke

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

Source

Invoke the given native DOM function with optional arguments.

lastChild

Elem? lastChild()

Source

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

make

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

Source

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

nextSibling

Elem? nextSibling()

Source

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

ns

Uri ns()

Source

The namespace URI of this element.

onEvent

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

Source

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

pagePos

Point pagePos()

Source

Position of element relative to the whole document.

parent

Elem? parent()

Source

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

pos

Point pos

Source

Position of element relative to its parent in pixels.

prevSibling

Elem? prevSibling()

Source

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

prop

Obj? prop(Str name)

Source

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

querySelector

Elem? querySelector(Str selectors)

Source

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

querySelectorAll

Elem[] querySelectorAll(Str selectors)

Source

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

relPos

Point relPos(Point p)

Source

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

remove

virtual This remove(Elem child)

Source

Remove a child element from this element. Return this.

removeAll

This removeAll()

Source

Remove all children from this element. Returns this.

removeAttr

This removeAttr(Str name)

Source

Remove the given HTML attribute from this element.

removeEvent

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

Source

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

renderCanvas

Void renderCanvas(|Graphics| f)

Source

Paint a <canvas> element. The given callback is invoked with a graphics context to perform the rendering operation. Before calling this code, you should set the canvas width/height attributes to match the element size (typically as a ratio of the Win.devicePixelRatio).

replace

virtual This replace(Elem oldChild, Elem newChild)

Source

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

scrollIntoView

This scrollIntoView(Bool alignToTop := true)

Source

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.

scrollPos

Point scrollPos

Source

Top left scroll position of element.

scrollSize

Size scrollSize()

Source

Scrollable size of element.

set

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

Source

Conveneince for setAttr.

setAttr

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

Source

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.

setProp

This setProp(Str name, Obj? val)

Source

Set the given DOM properity value for this element.

size

Size size

Source

Size of element in pixels.

style

Style style()

Source

Get the Style instance for this element.

tagName

Str tagName()

Source

Get the tag name for this element.

text

Str text

Source

Text content contained in this element.

transition

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

Source

Transition a set of CSS properties.

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

trap

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

Source

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")