All documentation ↓← All docs

editor.insertElement(element)

Inserts an element. This element must be created by editor.document.

Syntax

editor.insertElement(element)

Parameter

Type: HTMLElement

Required. The new element to insert.

Example usage

Code example
var editor1 = new RichTextEditor("#div_editor1");      
var img=editor1.document.createElement("IMG");      
img.src="/images/editor-image.png";        
editor1.insertElement(img); 

Calling editor.insertElement() from your app

editor.insertElement() belongs to the editor instance. Every integration below works the same way: keep the object that new RichTextEditor(...) returns, and call it on that object.

Plain JavaScript

Code example
var editor1 = new RichTextEditor("#div_editor1");
// The constructor is synchronous: the editor is ready on the next line.
editor1.insertElement(element);

React and Next.js

Code example
// editorRef is filled by the RichTextEditor wrapper from the React guides.
const editorRef = useRef(null);

function onClick() {
  editorRef.current?.insertElement(element);
}

return <RichTextEditor editorRef={editorRef} />;

In Vue and Angular, the wrapper components in the guides keep the instance in a component variable (editor), so the call is the same. See the React, Vue and Angular pages, or download a tested project from the guides.

If the editor is undefined

  • The call ran before the component mounted. Call it from an event handler or after the mount effect has run.
  • In React development mode, Strict Mode mounts, unmounts and mounts again, so the wrapper sets editorRef.current to null in between. Use editorRef.current?. rather than storing the instance elsewhere.
  • The editor was destroyed (editor.destroy()) when its component unmounted.

All methods: method reference · all events: event reference.