изменение изображения на клике не работает

Question

Я хочу сделать программу, которая меняет изображение, когда я нажимаю на него.

var image_tracker = "f"

function change() {
  var image = document.getElementById('social');
  if (image_tracker == "f") {
    image.src = "twit.jpg"
    image_tracker = "t"
  }
  if (image_tracker == "t") {
    image.src = "fb.jpeg"
    image_tracker = "f"
  }
}

<img src="fb.jpeg" id="social" onclick="change()">

Я пытался так же, как это делал человек на YouTube

ССЫЛКА: https://www.youtube.com/watch?v=SGKXZUGe2sw

Answer 1

Здесь у меня две вещи.

1) Синтаксическая проблема.Измените метод getElementByid() на getElementById()

2) Логическая проблема.У вас есть два if блоков.Файл переключится на изображение Twitter после нажатия на него, но, поскольку image_tracker теперь установлен на t, он будет выполнять логику во втором блоке if.Измените второй if на else if.

Answer 2

Вы заменяете свое изображение тем же самым изображением, которое вы используете дважды в операторе if, а не в if, сделайте это вместо

var image_tracker="f"
function change() {
    var image=document.getElementById('social');
    if (image_tracker=="f") {
        image.src="twit.jpg"
        image_tracker="t"
        image.alt='twit'
    }
    else if (image_tracker=="t") {
        image.src="fb.jpeg"
        image_tracker="f"
        image.alt='fbk'
    } 
}

<img src="fb.jpeg" id="social" onclick="change()" alt='fbk'>