Hierarchy

  • Select

Implements

Methods

  • Apply some css rules for all selections. It method wraps selections in nodeName tag.

    Example

    const editor = Jodit.make('#editor');
    editor.value = 'test';
    editor.execCommand('selectall');

    editor.s.applyStyle({color: 'red'}) // will wrap `text` in `span` and add style `color:red`
    editor.s.applyStyle({color: 'red'}) // will remove `color:red` from `span`

    Parameters

    • style: CanUndef<IStyle>
    • options: {
          className?: string;
          defaultTag?: keyof HTMLElementTagNameMap;
          element?: keyof HTMLElementTagNameMap;
      } = {}
      • Optional className?: string
      • Optional defaultTag?: keyof HTMLElementTagNameMap

        tag for wrapping and apply styles

      • Optional element?: keyof HTMLElementTagNameMap

        equal CSSRule (e.g. strong === font-weight: 700)

    Returns void

  • Clear all selection

    Returns void

  • Return current selection object

    Parameters

    • select: boolean = false

      Immediately add in selection

    Returns Range

  • Returns the current element under the cursor inside editor

    Parameters

    • checkChild: boolean = true

    Returns null | Node

  • Checks if the cursor is at the end(start) block

    Returns

    true - the cursor is at the end(start) block, null - cursor somewhere outside

    Parameters

    • start: boolean

      true - check whether the cursor is at the start block

    • parentBlock: HTMLElement

      Find in this

    Returns Nullable<boolean>

  • Call callback for all selection node

    Parameters

    • callback: ((current: Node) => void)
        • (current: Node): void
        • Parameters

          Returns void

    Returns void

  • Set focus in editor

    Parameters

    • options: FocusOptions = ...

    Returns boolean

  • Insert the cursor to any point x, y

    Returns

    false - Something went wrong

    Parameters

    • x: number

      Coordinate by horizontal

    • y: number

      Coordinate by vertical

    Returns boolean

  • Inserts in the current cursor position some HTML snippet

    Example

    parent.s.insertHTML('<img src="image.png"/>');
    

    Parameters

    • html: string | number | Node

      HTML The text to be inserted into the document

    • insertCursorAfter: boolean = true

    Returns void

  • Insert element in editor

    Parameters

    • node: Node
    • insertCursorAfter: boolean = true

      After insert, cursor will move after element

    • fireChange: boolean = true

      After insert, editor fire change event. You can prevent this behavior

    Returns void

  • Checks whether the current selection is something or just set the cursor is

    Returns

    true Selection does't have content

    Returns boolean

  • Checks whether the editor currently in focus

    Returns boolean

  • Remove all selected content

    Returns void

  • Remove all markers

    Returns void

  • Remove node element from editor

    Parameters

    Returns void

  • Restores user selections using marker invisible elements in the DOM.

    Returns void

  • Saves selections using marker invisible elements in the DOM.

    Parameters

    • silent: boolean = false

      Do not change current range

    Returns MarkerInfo[]

  • Set range selection

    Parameters

    • range: Range
    • focus: boolean = true

    Returns Select

  • Set cursor after the node

    Returns

    fake invisible textnode. After insert it can be removed

    Parameters

    Returns Nullable<Text>

  • Set cursor before the node

    Returns

    fake invisible textnode. After insert it can be removed

    Parameters

    Returns Nullable<Text>

  • Set cursor in the node

    Parameters

    • node: Node
    • inStart: boolean = false

      set cursor in start of element

    Returns Node

  • Wrap all selected fragments inside Tag or apply some callback

    Parameters

    • tagOrCallback: keyof HTMLElementTagNameMap | ((font: HTMLElement) => any)

    Returns HTMLElement[]

Constructors

Accessors

  • get hasMarkers(): boolean
  • Check if editor has selection markers

    Returns boolean

  • get html(): string
  • Return current selected HTML

    Example

    const editor = Jodit.make();
    console.log(editor.s.html); // html
    console.log(Jodit.modules.Helpers.stripTags(editor.s.html)); // plain text

    Returns string

  • get isInsideArea(): boolean
  • Checks if the selected text is currently inside the editor

    Returns boolean

  • get range(): Range
  • Return first selected range or create new

    Returns Range

Properties

jodit: IJodit

Jodit PRO

If you like Jodit - try Jodit PRO