CODEWITHSUNDEEP
javascripthtmlcachingdomgoogle-chrome-devtools
Kalai selvan
Kalai selvan

Reputation: 63

Get the source image file from img tag

I have an img tag with src="www.example.com/pic1.jpeg". The image file has already loaded fully. Now I want to save the image file.

I can download it by using the link in the src attribute. But I want to save the image without internet.

I opened DevTools and I was able to locate the image file in the Sources Tab -> Network pane. But still, I cannot able to save it without internet.

I use Chrome Canary Browser and Mac OS.

Upvotes: 1

Views: 2163

Answers (2)

Prem
Prem

Reputation: 164

Try this in console 

var linkElement = document.createElement('a');
try{
    url = "www.example.com/pic1.jpeg";
    linkElement.setAttribute('href', url);
    linkElement.setAttribute("download", ');
    var clickEvent = new MouseEvent("click", {
        "view": window,
        "bubbles": true,
        "cancelable": false
    });
    linkElement.dispatchEvent(clickEvent);          
}
catch (ex){  
    console.log(ex)
}

Upvotes: 2

Ashar Dweedar
Ashar Dweedar

Reputation: 643

When you click it on the network tab you will see a preview, right click it then save ...

edit :

i tried this and it worked : ctrl + s to save the page , it will be saved as html and another folder with the same name contains all content of that page including the pictures .

Upvotes: 2

Related Questions