This is going to sound strange, so allow me to preemptively say that it is for a project that will run only on a local (non-web-server) INTRAnet, and as such I'm without the power of PHP, Ajax, etc.
I have a DIV, which needs a unique background image assigned. The URL of the background image requires a dynamic path prefix, which I've acquired as a JavaScript variable.
Normally we would do something like:
document.getElementById('my_div').style.backgroundImage = "url(" + path_var + "'/image_name')";
But I am not willing to assign IDs to any of these DIVs. (This code will be huge, and will be frequently edited and sorted. IDs will make a mess of it.)
No big deal, on any other day I could just use:
this.style.backgroundImage = 'something';
... if I were attached to some sort of event. But I'm not. The image needs to be set immediately as the page loads. Using a mouseover/mouseout/etc. does no good -- the DIV would have no background until / unless someone moused over it.
So what I need is this:
<div>
<script>
this.style.backgroundImage = 'something';
</script>
</div>
I've tried replaceing 'this' with 'parentNode', appending 'parentNode', juggling all sorts of instances of 'document,' etc. but to no avail.
I suspect that what I want is not possible -- to reference and manipulate a container without an ID from an
inline script. (To clarify -- I cannot create a function, because I know of no method of calling it for each DIV in question. If there is such a method, I will be thrilled!)
