How to block image from loading in Javascript?

Asked Jan 31 '20 at 07:38

Active Jan 31 '20 at 09:08

Viewed 537 times

I am changing src of all images to '' using mutation observer. But browser is making the request to that image URL. How to block image requests from the browser?

Below is the code.

const observer = new MutationObserver(mutations => {
    mutations.forEach(({
        addedNodes
    }) => {
        addedNodes.forEach(node => {
            if( node.tagName == "IMG" ){
                node.setAttribute("data-src",src);
                node.removeAttribute('src');
            }                                      
        });
    });
});
observer.observe(document.documentElement, {
    childList: true,
    subtree: true
});

edited Jan 31 '20 at 09:08

Vishnu

11,614
6
51
90

asked Jan 31 '20 at 07:38

rasala haripriya

1

Where is your question? – Renato Jan 31 '20 at 07:45
1

Does this answer your question? [Request Blocking Using Javascript?](https://stackoverflow.com/questions/48295525/request-blocking-using-javascript) – Renato Jan 31 '20 at 07:45
1

Now check my question once. – rasala haripriya Jan 31 '20 at 07:48
I'm pretty sure that any markup like this: `` is going to trigger a request. You need to start with `` and then introduce `src` rather than vice versa. – Rounin Jan 31 '20 at 09:15
we don't have option to set `data-src` in html, as we don't have control over html code. We are creating a third party script to block some elements from loading. – rasala haripriya Jan 31 '20 at 09:22

How to block image from loading in Javascript?

0 Answers0