Как создать src изображения в JS?

Как в js создать src для изображения? Тег и класс изображения я создал, а каким образом создать src я не понимаю =(

let main = document.querySelector('.main_block');
let child_block = document.querySelector('.child_block');

let xep = document.createElement('img');              
xep.className = 'img_s';
child_block.prepend(xep);
body{
display:grid;
place-items:center;     
user-select:none;
}


.main_block{
display:grid;
place-items:center; 
border:1px solid black;
width: 50%;
height:500px;
margin:50px;

}

.img_s{
width:100%;
border:1px solid red;
}

.child_block{

width:50%;
height:50%;     
}
<div class = "main_block">

<div class = "child_block">


</div>

</div>


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

Автор решения: novvember

Так же, как вы добавили класс только что созданному изображению можно добавить и src-свойство. Очень многие свойства объектов на странице можно так изменить.

Пробуйте гуглить, как изменить тот или иной атрибут элемента. Или попробуйте вывести нужный элемент в консоль через console.dir(), там будут показаны все свойства объекта, их сможете менять. Например, попробуйте добавить в ваш код console.dir(xep) и посмотреть, что выведет.

let main = document.querySelector('.main_block');
let child_block = document.querySelector('.child_block');

let xep = document.createElement('img');              
xep.className = 'img_s';
xep.src = 'https://pets.mail.ru/pre_rect840x0_resize/pic/wysiwyg/2019/05/17/IMG_7005.jpg';
child_block.prepend(xep);
body{
display:grid;
place-items:center;     
user-select:none;
}


.main_block{
display:grid;
place-items:center; 
border:1px solid black;
width: 50%;
height:500px;
margin:50px;

}

.img_s{
width:100%;
border:1px solid red;
}

.child_block{

width:50%;
height:50%;     
}
<div class = "main_block">

<div class = "child_block">


</div>

</div>

→ Ссылка