var image1=new Image(); // добавление картинки
image1.src="3/2.jpg"; // расположение начального фона
function q1(){ // начальный фон
ctx.drawImage(image1,0,0); // прогрузка начального фона в координатах 0 0
}
image1.onload=q1; // когда картинки загрузится
//Когда нажимаю на кнопку картинка должна удалятся
btn2=document.createElement( 'BUTTON'); // создание кнопки
btn2.id='cmd2'; // её id
btn2.textContent ='удалить картинку'; // её текст
document.body.appendChild(btn2); // нужно чтобы добавилось
btn2.onclick=function(){ // функция при клике на неё
}
Решение вашей задачи:
var src = 'https://www.gravatar.com/avatar/4deff273cbbbb0e3a73938e37697036f?s=32&d=identicon&r=PG&f=1',
id = 'myImage';
function createButtons() {
// First button / Generate image
var buttonGenerate = document.createElement('BUTTON'),
buttonDelete = document.createElement('BUTTON');
buttonGenerate.textContent = 'Add';
buttonDelete.textContent = 'Delete';
var body = document.querySelector('body');
body.appendChild(buttonGenerate);
body.appendChild(buttonDelete);
buttonGenerate.addEventListener('click', createImgElement);
buttonDelete.addEventListener('click', deleteImgElemet);
}
function createImgElement() {
var image = document.createElement("IMG");
image.id = id;
image.src = src;
// image.alt = alt;
document.querySelector('body').appendChild(image);
}
function deleteImgElemet() {
var image = document.getElementById(id);
if (image != undefined) {
image.remove();
} else {
console.log('Image is undefined');
}
}
createButtons();
<body>
<h1>Hello!</h1>
</body>
Только картинка не подгружается, попробуйте вставить код в вашу локальную среду разработки, там должно работать все как часы.
Основные этапы разработки сайта для стоматологической клиники
Продвижение своими сайтами как стратегия роста и независимости