Вставить в contenteditable div изображение из буфера обмена

Копирую изображение в буфер обмена, затем в contenteditable div нажимаю CTRL V - запускается следующий скрипт:

let el = document.getElementById("editabletext");

el.onpaste = function(event){
    let items = (event.clipboardData || event.originalEvent.clipboardData).items;

    let blob = null;
    for (let i = 0; i < items.length; i++) {
        if (items[i].type.indexOf("image") === 0) {
            blob = items[i].getAsFile();
        }
    }
    // load image if there is a pasted image
    if (blob !== null) {
        let reader = new FileReader();


        reader.readAsBinaryString(blob);
    }

После того, как отработает функция reader.readAsBinaryString(blob); изображение автоматически вставляется в div:

![введите сюда описание изображения

Проблема заключается в том, что после того, как изображение вставилось в div, я, получается, теряю над ним контроль, так как у него нет ни id, ни даже класса. А мне нужно еще разместить его по центру, изменить размер и прочее.

Можно ли как нибудь перед вставкой присвоить изображению id?


Ответы (0 шт):