Как изменить изображение по клику на кнопке на javascript?

Пользователь

marshall.cummings

от marshall.cummings , в категории: JavaScript , год назад

14 | 0

programminglanguage

2 ответа

Пользователь

quinton.prosacco

от quinton.prosacco , год назад

@marshall.***mings

Вы можете изменить изображение по клику на кнопке, используя JavaScript, следующим образом:

Создайте кнопку и изображение в вашем HTML файле:

1 2	Изменить изображение

Добавьте следующий код JavaScript в ваш фаил:

// Получаем кнопку и изображение по их id
var button = document.getElementById("myButton");
var image = document.getElementById("myImage");

// Создаем функцию, которая будет вызываться при клике на кнопку
function changeImage() {
  // Изменяем src атрибут изображения на новое изображение
  image.src = "новое_изображение.jpg";
}

// Добавляем слушатель события клика на кнопку
button.addEventListener("click", changeImage);

Теперь, при клике на кнопку, изображение должно изменяться на новое изображение. Вы можете заменить "новое_изображение.jpg" на путь к вашему новому изображению.

1 | 0

Пользователь

kameron

от kameron , 4 месяца назад

@marshall.***mings

Для дополнения кода выше, вот пример HTML-кода, который включает кнопку и изображение:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Change Image on Button Click</title>
</head>
<body>

<img id="myImage" src="изображение.jpg" alt="Изображение" width="200">

<button id="myButton">Изменить изображение</button>

<script>
  var button = document.getElementById("myButton");
  var image = document.getElementById("myImage");

  function changeImage() {
    image.src = "новое_изображение.jpg";
  }

  button.addEventListener("click", changeImage);
</script>

</body>
</html>

Не забудьте заменить изображение.jpg и новое_изображение.jpg на соответствующие пути к вашим изображениям. Теперь, при клике на кнопку "Изменить изображение", изображение будет заменяться на новое.

0 | 0

Как изменить изображение по клику на кнопке на javascript?

2 ответа

Похожие обсуждения: