Сравнение источника изображения (оператор If)

Question

Сравнение источника изображения (оператор If)

1

Итак, я пытаюсь создать оператор If, чтобы сравнить источник моего изображения, чтобы я мог изменить его с соответствующим обратным изображением.

function changeBack() {
let image = document.getElementById('product__picture');  
    console.log(image);
if(image.src === 'assets/red.jpg'){
    image.src = ('assets/red-reversed.jpg');
    console.log(image);

} else if(image.src === 'assets/orange.jpg'){
    image.src = ('assets/orange-reversed.jpg');
}

HTML:

<article class="product">
       <h2 class="hidden">Display Picture</h2>
       <img id="product__picture" src="assets/red.jpg" alt="Laptop case">
</article>

Здесь моя кнопка onclick:

 <article id="reverse">
        <h2 class="subtitle">Select side</h2>
        <div id="reverse__container">
        <p id="front" class="reverse__text">Front</p>
        <p id="back" class="reverse__text" onclick="changeBack();">Back</p>
    </div>
    </article>

PrettyPotatu 30 нояб. 2018, в 15:34

Источник

0

Вам не нужно просто читать из image.src и устанавливать его? Вам также не нужны скобки вокруг строк, но они также не должны вызывать проблем.
Rup 30 нояб. 2018, в 13:43

Теги:

javascript

2 ответа

Ещё вопросы

Вам не нужно просто читать из image.src и устанавливать его? Вам также не нужны скобки вокруг строк, но они также не должны вызывать проблем.

Nina Scholz · Answer 1 · 2018-11-30T12-33-00.000Z

Вам нужно проверить свойство src а не объект.

Кстати, строки не нужны круглые скобки.

function changeBack() {
    let image = document.getElementById('product__picture');

    if (image.src === 'assets/red.jpg') {
        image.src = 'assets/red-reversed.assets';
    } else if (image.src === 'assets/orange.jpg') {
        image.src = 'assets/orange-reversed.jpg';
    }
}

Имейте в image.src что image.src может быть полным URL, а не только assets / red.jpg.
@LucasOliveira Я проверил, поместив его в console.log (), и там написано 'assets / red.jpg', так что должно быть в порядке?
Хорошо!! Тогда проблем нет ... Решение выше верное :)

Fadi Tash · Answer 2 · 2018-11-30T12-16-00.000Z

сравните свойство src изображений, а не самих объектов изображения! Вам также не нужны дополнительные скобки вокруг свойств строки. кроме того, используйте === вместо == для сравнений равенства того же типа. Я почти никогда не использую двойных равных.

function changeBack() {
  let image = document.getElementById('product__picture');  

  if(image.src === 'assets/red.jpg'){
      image.src = 'assets/red-reversed.assets'
  } else if(image.src === 'assets/orange.jpg') {
      image.src = 'assets/orange-reversed.jpg';
  }
}

Кажется, я не могу сейчас войти в мое утверждение if, хотя мой источник верен
что вы видите в консоли, если вы вошли в систему image.src