How to add a style attribute to an image added using getDoc (). CreateElement ("img"); at TinyMCE

Question

How to insert image at cursor position in tinymce

From the above question, I manage to add an image to TinyMCE.

var ed = tinyMCE.get('txt_area_id'); // get editor instance var range = ed.selection.getRng(); // get range var newNode = ed.getDoc().createElement ( "img" ); // create img node newNode.src="sample.jpg"; // add src attribute range.insertNode(newNode); // insert Node 

I am trying to add width to newNode with this code:

  newNode.style = "width:600px;"; // not working 

but its not working, the same goes for class I, I cannot add a class through this code:

 newNode.class= "myClass"; // this one is also not working 

If anyone has an idea, please let me know thanks.

Answer 1

The problem is here:

 newNode.style = "width:600px;"; 

Access to the node style object, not the style attribute. This way you can update or set the style object:

 newNode.style.width = "600px;"; 

Or update or set the style attribute:

 newNode.setAttribute("style", "width:600px"); 

Note that in the last example, any existing values ​​stored in the style attribute will be overwritten with a new line; To update only one property value, you must use the previous example and specify the specific properties of the style object.

To update element classes:

 newNode.className = "newClassName"; 

Or:

 newNode.classList.add("newClassName");