Home Manual Reference Source Test
public class | source

Component

Utility methods of Web Component

Test:

Static Member Summary

Static Public Members
public static get

Member Summary

Public Members
public get
public get

Main view of this component

Method Summary

Public Methods
public

$(selector: string): Element[]

public

$slot(selector: string): Element[]

public

$up(selector: string): Element

public

buildDOM(option: Object): HTMLElement

public

on(type: string, selector: string, callback: DOMEventHandler): Element

Delegate listener for DOM events

public

trigger(event: String | Event, detail: *, bubbles: Boolean, cancelable: Boolean, composed: Boolean): Boolean

Protected Methods
protected

attributeChangedCallback(name: string, oldValue: string, newValue: string): *

Assign the new value to the DOM property which has the same name of the changed attribute

Static Public Members

public static get tagName: string source

Test:

Public Members

public get [Symbol.toStringTag]: * source

public get view: View source

Main view of this component

Public Methods

public $(selector: string): Element[] source

Params:

NameTypeAttributeDescription
selector string

CSS selector

Return:

Element[]

Element set which matches selector in this Shadow DOM

public $slot(selector: string): Element[] source

Params:

NameTypeAttributeDescription
selector string

CSS selector

Return:

Element[]

Matched elements which assigned to slots

public $up(selector: string): Element source

Params:

NameTypeAttributeDescription
selector string

CSS selector

Return:

Element (nullable: true)

Matched parent

public buildDOM(option: Object): HTMLElement source

Params:

NameTypeAttributeDescription
option Object
  • nullable: true

https://developer.mozilla.org/en-US/docs/Web/API/element/attachShadow#Parameters

Return:

HTMLElement

This custom element

Test:

public on(type: string, selector: string, callback: DOMEventHandler): Element source

Delegate listener for DOM events

Params:

NameTypeAttributeDescription
type string

Name of a DOM event

selector string
  • optional

CSS selector of delegate elements

callback DOMEventHandler

Return:

Element

This element

Test:

public trigger(event: String | Event, detail: *, bubbles: Boolean, cancelable: Boolean, composed: Boolean): Boolean source

Params:

NameTypeAttributeDescription
event String | Event
detail *
  • nullable: true

Additional data

bubbles Boolean
  • nullable: true
cancelable Boolean
  • nullable: true
composed Boolean
  • nullable: true

Whether the event will cross from the shadow DOM into the standard DOM after reaching the shadow root

Return:

Boolean

Event be canceled or not

Test:

Protected Methods

protected attributeChangedCallback(name: string, oldValue: string, newValue: string): * source

Assign the new value to the DOM property which has the same name of the changed attribute

Params:

NameTypeAttributeDescription
name string
oldValue string
  • nullable: true
newValue string
  • nullable: true

Return:

*

DOM property value of newValue