jj
    Preparing search index...

    Class JJT<T>

    Wraps a DOM Text Node.

    The Text interface represents the textual content of Element or Attr. If an element has no markup within its content, it has a single child implementing Text that contains the element's text.

    Text

    Type Parameters

    • T extends Text = Text

    Hierarchy (View Summary)

    Index

    Constructors

    constructor

    Accessors

    ref

    Methods

    addText clone empty getText off on run setText trigger from fromStr isWrapable unwrap unwrapAll wrap wrapAll

    Constructors

    • Creates an instance of JJT.

      Type Parameters

      • T extends Text = Text

      Parameters

      • ref: T

        The Text node or a string to create a Text node from.

      Returns JJT<T>

      const text = new JJT('Hello World')

      If ref is not a Text node or string.

    Accessors

    • get ref(): T

      Gets the underlying DOM object.

      Returns T

    Methods

    • Appends text to the existing content.

      Parameters

      • Optionaltext: any

        The string to add to the existing contents. If null or undefined, nothing is added.

      Returns this

      This instance for chaining.

      text.setText('hello')
      text.addText(' world')
      console.log(text.getText()) // 'hello world'

      Node.textContent

    • Gets the text content of the Text node.

      Returns string

      The text content.

      const content = text.getText()

      Node.textContent

    • Removes an event listener.

      Parameters

      • eventName: string

        The name of the event.

      • handler: EventListenerOrEventListenerObject | null

        The event handler.

      • Optionaloptions: boolean | EventListenerOptions

        Optional event listener options or boolean.

      Returns this

      This instance for chaining.

      Pass the same handler reference that was used in on() to properly remove the listener.

      const handler = function() { console.log(this) }
      JJET.from(window).on('resize', handler)
      JJET.from(window).off('resize', handler)

      EventTarget.removeEventListener

    • Adds an event listener.

      Parameters

      • eventName: string

        The name of the event.

      • handler: EventListenerOrEventListenerObject | null

        The event handler.

      • Optionaloptions: AddEventListenerOptions

        Optional event listener options.

      Returns this

      This instance for chaining.

      The handler is automatically bound to this JJET instance, so this inside the handler refers to the JJET instance, not the DOM element. To access the DOM element, use this.ref.

      JJET.from(window).on('resize', function() {
        console.log(this) // JJET instance
        console.log(this.ref) // window object
      })

      EventTarget.addEventListener

    • Runs a function in the context of this JJET instance.

      Type Parameters

      • R
      • Args extends any[]

      Parameters

      • fn: (this: this, ...args: Args) => R

        The function to run. this inside the function will refer to this JJET instance.

      • ...args: Args

        Arguments to pass to the function.

      Returns R

      The return value of the function.

      node.run(function() {
        console.log(this.ref)
      })

      If you want to access the current JJ* instance using this keyword, you SHOULD use a function not an arrow function. If the function throws, run() doesn't swallow the exception. So if you're expecting an error, make sure to wrap it in a try..catch block and handle the exception. If the function returns a promise, you can await on the response.

    • Sets the text content of the Text node.

      Parameters

      • Optionaltext: any

        The text to set. Set it to null or undefined to remove all text

      Returns this

      This instance for chaining.

      text.setText('New content')

      Node.textContent

    • Creates a JJT instance from a Text node.

      Parameters

      • text: Text

        The Text node.

      Returns JJT

      A new JJT instance.

      const textNode = document.createTextNode('foo')
      const text = JJT.from(textNode)

      If text is not a Text node.

    • Checks if a value can be passed to the wrap() or unwrap() function.

      Parameters

      • x: unknown

        an unknown value

      Returns x is Wrappable

      true if x is a string, Node (or its descendents), JJN (or its descendents)

      This is useful for filtering the array that is passed to append(), prepend() or setChildren()

    • Extracts the underlying native DOM node from a wrapper.

      Parameters

      Returns Unwrapped

      The underlying DOM node.

      If the input is already a native Node, it is returned as is. If the input is a string, a new Text node is created and returned.

      const rawElement = JJN.unwrap(myJJHE) // Returns HTMLElement

      If the input cannot be unwrapped.

    • Wraps a native DOM node or string into the most specific JJ wrapper available.

      Parameters

      • raw: Wrappable

        The object to wrap. If it's already Wrapped, it'll be returned without any change. We don't double-wrap or clone it.

      Returns Wrapped

      The most granular Wrapped subclass instance. If the input is already wrapped, it'll be returned as is without cloning.

      This function acts as a factory, inspecting the input type and returning the appropriate subclass of JJN (e.g., JJHE for HTMLElement, JJT for Text).

      const bodyWrapper = JJN.wrap(document.body) // Returns JJHE
      const textWrapper = JJN.wrap('Hello') // Returns JJT wrapping a new Text node

      If the input is not a Node, string, or JJ wrapper.

    • Wraps an iterable object (e.g. an array of wrapped or DOM elements).

      Parameters

      • iterable: Iterable<Wrappable>

        The iterable to wrap.

      Returns Wrapped[]

      An array of wrapped instances.

      const wrappedList = JJN.wrapAll(document.querySelectorAll('div'))

    Settings

    Member Visibility

    On This Page

    Constructors
    Accessors
    Methods