multiple ID(elements) inside document.getElementById('')

[nnoza]

I´ve got a problem right here! The problem is that I need to have multiple ID(elements) inside document.getElementById('') but this code won´t work. I found it on a similar website that uses exactly the same code as I´ve got here. The strange thing is that the code works on this site but won´t work at all on my!!???!? I am not so used to js so please help me anyone if possible.

As it is now the js code steers only the "nav1". So my question is how can I have multiple ID:s inside document.getElementById('')..? Is it possible at all?

Here is the link to the working site: http://mjijackson.com/shadowbox/ (Image Map)..




<script type="text/javascript">

window.onload = function(){

Shadowbox.init();

/**
* Note: The following command is not necessary in your own project. It is
* only used here to set up the demonstrations on this page.
*/
initDemos();

};

function initDemos(){

Shadowbox.setup([

document.getElementById('nav3'),
document.getElementById('nav4'),
document.getElementById('nav4')

], {
gallery: 'Flash',
continuous: true,
counterType: 'skip',
animSequence: 'sync'
});
Shadowbox.setup(document.getElementById('hongkongmap').getElementsByTagName('area'));
};

</script>






<img src="text3.png" width="730" height="238" alt="projects 1 & 2" usemap="#nav3">
<map id="nav3" name="nav3">
<area shape="rect" coords="30,11,241,143" href="blekingemenu.png" alt="Blekingemenu.com">
<area shape="rect" coords="260,11,471,143" href="admalish.png" alt="Admalish">
</map>

<img src="text4.png" width="730" height="238" alt="projects 3 & 4" usemap="#nav4">
<map id="nav4" name="nav4">
<area shape="rect" coords="30,11,241,143" href="wii_confess.png" alt="">
<area shape="rect" coords="260,11,471,143" href="admalish.png" alt="">
</map>

<img src="text5.png" width="730" height="238" alt="projects 5 & 6" usemap="#nav5">
<map id="nav5" name="nav5">
<area shape="rect" coords="30,11,241,143" href="blekingemenu.png" alt="">
<area shape="rect" coords="260,11,471,143" href="admalish.png" alt="">
</map>

[jscheuer1]

You cannot have multiple ids inside getElementById. If you are following a working script and having problems, you are either trying to get it to do something that it wasn't designed to do, or you've missed and/or messed up one or more of the steps in installing it. For example, the demo page states that the script requires a valid document. Have you validated your document?

As I hope you can tell be my approach here, it could be a number of things, so:

Please post a link to the page on your site that contains the problematic code so we can check it out.

[Master_script_maker]

here is a custom function i made that returns multiple elements:

<script type="text/javascript">
Document.prototype.getElementsByIds = function() {
var ele=new Array();
for(var i=0;i<arguments.length;i++) {
ele[i] = document.getElementById(arguments[i]);
}
return ele;
}
</script>
you would use it like this: var e=document.getElementsByIds("id1","id2","id3"); with as many ids as you want and it would return them in an array e.g. e[0]==the first one...

[codeexploiter]

here is a custom function i made that returns multiple elements:

<script type="text/javascript">
Document.prototype.getElementsByIds = function() {
var ele=new Array();
for(var i=0;i<arguments.length;i++) {
ele[i] = document.getElementById(arguments[i]);
}
return ele;
}
</script>
you would use it like this: var e=document.getElementsByIds("id1","id2","id3"); with as many ids as you want and it would return them in an array e.g. e[0]==the first one...

I feel that it would be better if you don't extend JavaScript's built-in objects. You can treat this as a custom object based function rather than extending a built-in object.

I've modified the function a little bit



var getElementsByIds = function(ids){
if(ids == undefined || (typeof ids != 'object') || (ids.length == 0)){
alert('Expecting an array based parameter or there are no ids, exiting');
return null;
}
var elems = [];
for(var i = 0; i < ids.length; i++){
elems[i] = document.getElementById(ids[i]);
}

return elems;
}