Why doesn’t my if return true?

Asked

Viewed 84 times

-2

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>

<img src="image/img1.jpg" alt="">  
  
<script>

  var img = window.document.getElementsByTagName("img")[0].src;

  if (img.src == "image/img1.jpg")
  {
    console.log("É igual");
  }

  else {
    console.log("Não é igual");
  }

    // console.log(img);

</script>

</body>
</html>

In the code above the if compares if "image/img1.jpg" is equal to "image/img1.jpg" because it returns the false that is Não é igual, was not to return true and execute É igual?

javascript

  • var img = window.document.getElementsByTagName("img")[0].src; you are already initiating img with the value of the property src. Remove src here, or remove src inside if.

  • It did not work to remove src from the variable and if it runs Else the same way.

2 answers

2

You are already using the src property when you take the element, but the src property can bring the absolute path from the image, so try to do a contained one (includes):

<script>
  var img = window.document.getElementsByTagName("img")[0];

  if (img.src.includes("image/img1.jpg"))
  {
    console.log("É igual");
  }
  else {
    console.log("Não é igual");
  }
</script>

Or:

<script>
  var img = window.document.getElementsByTagName("img")[0].src;

  if (img.includes("image/img1.jpg"))
  {
    console.log("É igual");
  }
  else {
    console.log("Não é igual");
  }
</script>

  • Thanks, it worked here thanks, but only a doubt as you said that "the property src can bring the absolute path of the image", I played on the console the variable img to see the value of src and it sampled the absolute url, so I compared src with the absolute url and false rotor, because?

  • I did not simulate this situation, make a console.log(img.src) to see if the values are really equal, use the browser console itself to make the comparison, can help you.

  • I tested more it always falls into false and runs Else.

1


On the line:

var img = window.document.getElementsByTagName("img")[0].src;

Returns the absolute path of the image. And inside the if you’re picking up again .src:

       ↓↓↓↓
if (img.src == "image/img1.jpg"){
   ...
}

That is to say, img.src will return Undefined, and will always fall in else.

What you wanted to do was actually compare the value of the variable img (without the .src) with the relative path of the image:

if (img == "image/img1.jpg"){
   ...
}

But the else because the value of img will be the absolute way, which is different from the relative image/img1.jpg.

What you can do is use the method .getAttribute() to get the exact value of the attribute src image, and not the absolute path, and compare in the if:

var img = window.document.getElementsByTagName("img")[0].getAttribute("src");

if(img == "image/img1.jpg"){
   console.log("É igual");
}else{
   console.log("Não é igual");
}

console.log(img); // imprime: image/img1.jpg

Browser other questions tagged javascript

You are not signed in. Login or sign up in order to post.