how to check if link directs to an existing image javascript

Question

I want to know if a links redirects to an actual existing image in javascript because I don't want the following to happen:

<img src="http://idontexist.lol/fakeimg.png" alt="non existant image" width="400">

use onload function for image to ensure if image exists

Cagri Tacyildiz
– Cagri Tacyildiz

2020-05-28 17:11:46 +00:00
Commented May 28, 2020 at 17:11 — Cagri Tacyildiz
– Cagri Tacyildiz, Commented May 28, 2020 at 17:11
You can try hitting the URL and see if it's giving 404

Sid
– Sid

2020-05-28 17:12:55 +00:00
Commented May 28, 2020 at 17:12 — Sid
– Sid, Commented May 28, 2020 at 17:12

Cagri Tacyildiz · Accepted Answer · 2020-05-28 17:21:29Z

1

onload() function is used to detect if image is valid in url.If you enter onload function it is valid image url

function test(event,val){
   console.log("image"+val+" is loaded");
   event.style.display="block";
}

<img src="http://idontexist.lol/fakeimg.png"onload="test(this,1)" alt="non existant image"style="display:none" width="400">
<img src="https://cdn.sstatic.net/Img/unified/sprites.svg?v=fcc0ea44ba27g"onload="test(this,2)"style="display:none" alt="non existant image" width="400">

edited May 28, 2020 at 17:21

answered May 28, 2020 at 17:14

Cagri Tacyildiz

17.7k6 gold badges38 silver badges61 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

how to check if link directs to an existing image javascript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related