JSFiddle - React, Tailwind, and code Playground

by Jader Wagner

HTML

<div></div>
<img class="registrar-cache" src="https://imageshack.us/download/689/nkgc.png" />
<img class="registrar-cache" src="https://imageshack.us/download/855/sq9g.jpg" />
<img src="https://imageshack.us/download/844/ybfp.jpg" />

CSS

img {
    width:200px;
    cursor:pointer;
}

JavaScript

var storage = window.localStorage;
if (!storage.ElementosNoCache) {
    storage.ElementosNoCache = "";
}

function RegistrarCache(src) {
    if (!VerificarCache(src)) {
        storage.ElementosNoCache += '[' + src + ']';
    }
}

function RemoverCache(src) {
    if (VerificarCache(src)) {
        storage.ElementosNoCache = storage.ElementosNoCache.replace('[' + src + ']', '');
    }
}

function VerificarCache(src) {
    return (storage.ElementosNoCache.indexOf('[' + src + ']', 0) >= 0);
}

function LimparCache() {
    storage.ElementosNoCache = "";
}

$(document).ready(function () {

    $(".registrar-cache").one('load', function () {
        RegistrarCache($(this).attr("src"));
    }).each(function () {
        if (this.complete) $(this).load();
    });

    $('div').html(storage.ElementosNoCache);

    $("img").click(function () {
        if (VerificarCache($(this).attr("src"))) alert('Esta no Cache!');
        else alert('Não esta no cache!');
    });

});