Unless you go beyond what can reasonably be stored in memory you don't need an advanced resource manager. That is true for desktop games as well, most "small" games get away with just loading everything into memory at launch, and then it's there when needed.
In HTML and JavaScript you don't have direct control of resources in the same way, the browser has a built in resource manager working for you. However, it may be a good idea to help it a bit in order to achieve having all images loaded at launch and preventing them from getting unloaded when not in use.
For this purpose you can create a bunch of image elements and attach the needed images to them, this will cause the images to get loaded and stay in memory. You don't even need to attach them to the document, they can simply exist as virtual entities in your script.
Here is the loading part of a game I wrote. It loads 27 images in the manner described, it continually checks if they are all loaded along with the document body, it displays a counter to the user telling how far the loading has progressed and finally calls a function to render the menu when all assets are loaded.
<body onload="bodyloaded=1">
<div id='maindivid'>
<p id='loadtext' style='text-align:center;'>
Loading 0/28
</p>
</div>
<script type="text/javascript">
bodyloaded=0
prlimg=new Array
for(a=0;3>a;a++){
prlimg[a]=new Array
for(b=0;3>b;b++){
prlimg[a][b]=new Array
for(c=0;3>c;c++){
prlimg[a][b][c] = new Image
prlimg[a][b][c].src = a+(b+(c+".png"))
}
}
}
function updateload(){
elementsloaded=bodyloaded
for(a=0;3>a;a++){
for(b=0;3>b;b++){
for(c=0;3>c;c++){
elementsloaded+=prlimg[a][b][c].complete
}
}
}
document.getElementById('loadtext').innerHTML="Loading "+elementsloaded+"/28"
if(elementsloaded==28){menu()}
else{setTimeout("updateload()",100)}
}
updateload()
</script>
//Further code goes here
</body>
See the code in action.
When I look at it again there is a couple of things I could have done differently, but it should suffice to demonstrate the functionality.