Оператор равенства Javascript

#javascript #html

#javascript #HTML

Вопрос:

Итак, я новичок в Javascript. В моем коде у меня есть объект image, который объявлен следующим образом:

         <img src="me.png" id="changepic" alt="That's me!">
  

В моем скриптовом коде я хочу написать логическое выражение, которое возвращает true, когда src равен «me.png», как на картинке, и возвращает false, если это НЕ «me.png». Этот логический оператор находится в пределах условий приведенного ниже оператора if:

 function changeImage() {
    if (document.getElementById("changepic").src === "me.png"){
        document.getElementById("changepic").setAttribute("src", "me2.png");
    }
}
  

Я присвоил кнопке функцию changeImage. Код для кнопки написан ниже:

 <button type="button" onclick="changeImage()">Change Image</button>
  

По какой-то причине логический оператор внутри оператора if всегда возвращает false , хотя значение src элемента действительно равно «me.png». Я понял, что это проблема с тем, как я пишу оператор равенства, но я не знаю, как написать оператор равенства в javascript, который возвращал бы true, если значение src равно «me.png», и возвращал false, если значение src равно «me2.png». Есть желающие?

Комментарии:

1. Если у вас возникают проблемы такого типа, когда условия оцениваются не так, как вы ожидаете, начните с регистрации значений проблемы в консоли или временно добавьте оповещение в свою функцию (для вашего примера): alert(document.getElementById('changepic'));

Ответ №1:

Изменить:

 if (document.getElementById("changepic").src === "me.png"){
  

Для:

 if (document.getElementById("changepic").src.match(/me.png$/)){
  

as .src обычно содержит полный путь к изображению, даже если вы не указываете его в HTML.

Ответ №2:

Проблема не в вашем равенстве, а в

 document.getElementById("changepic").src
  

который, вероятно, возвращает не то, что вы думаете, что он возвращает. Попробуйте

console.log(document.getElementById("changepic").src)

и убедитесь, что это действительно «me.png». Бьюсь об заклад, это что-то другое.

Имейте в виду, что в js === проверяет равенство как типа, так и значения, где as == будет проверять равенство более свободно; это более снисходительно. например

 2 === "2" // false because not the same type
2 == "2" // true because == tries to make the types lines up, then tests
  

Комментарии:

1. src определяется спецификацией как строка.

Ответ №3:

«Относительные URI преобразуются в полные URI с использованием базового URI. [RFC1808], раздел 3, определяет нормативный алгоритм для этого процесса. Для получения дополнительной информации о базовых URI, пожалуйста, обратитесь к разделу о базовых URI в главе о ссылках.»

Отсюда:http://www.w3.org/TR/1999/REC-html401-19991224/types.html#type-uri

Вы должны просто смотреть на «самые правые» символы при сравнении.

Например

   var mystr = document.getElementById("changepic").src

  mystr.substr(len(mystr)-6,6) === "me.png"