How to parse TinyMce article content to find inline images using JS

I want to analyze the content written in the TinyMCE editor on the client side I want to get all the values ​​of the src attributes of the images inserted into the editor (in the body of the article) and save them in an array.

How can i do this?

thanks

(I tried:

var arr = new Array(); $(".txtEditorClass img").each(function() {arr.push( $(this).attr("src"))}); 

This did not work. I also did a test using regular JS to see which images were found:

var arr = document.getElementsByTagName("img"); for(var i = 0; i < arr.length; i++) { alert(arr[i].src); } var arr = document.getElementsByTagName("img"); for(var i = 0; i < arr.length; i++) { alert(arr[i].src); } All images src image values ​​outside the editor where it is shown, but not the images embedded in the text of the letter)

+4
source share
2 answers

TinyMCE editor installed inside and iFrame. To access the internal elements, you need to use the tinyMCE.activeEditor.dom.getRoot () function (doc: http://wiki.moxiecode.com/index.php/TinyMCE:API/tinymce.dom.DOMUtils/getRoot )

So, to get all the images inside the editor, use something like:

 var arr = new Array(); $(tinyMCE.activeEditor.dom.getRoot()).each( function() { arr.push( $(this).attr("src")) }); 
+5
source

Answer:

 var arr = new Array(); $(tinyMCE.activeEditor.dom.getRoot()).find('img').each( function() { arr.push($(this).attr("src")); }); 

I want to thank Pierre-Loic Doulcet for their help.

0
source

Source: https://habr.com/ru/post/1313032/


All Articles