Select a random element from array and check its index

Question

I have the first part of this problem down, I am able to select a random element from the array like so

function setImage()
{

var images = ['anemone.gif', 'ball.gif', 'crab.gif', 'fish2.gif', 'gull.gif',  'jellyfish.gif', 'moon.gif', 'sail.gif', 'shell.gif', 'snail.gif', 'sun.gif', 'sunnies.gif', 'whale.gif'];
var slots = [document.getElementById('slot0'), document.getElementById('slot1'), document.getElementById('slot2')];
document.getElementById('slot0').src = images[Math.floor(Math.random() * images.length)];
document.getElementById('slot1').src = images[Math.floor(Math.random() * images.length)];
document.getElementById('slot2').src = images[Math.floor(Math.random() * images.length)];
alert(images.indexOf(document.getElementById('slot2')));
}

However the second line is not giving me the correct index of the element, and I'm not sure how else to find it?

setting index in slot2 but alerting content of slot0 is it right ? — Nikson Kanti Paul
– Nikson Kanti Paul, Commented Oct 7, 2012 at 12:16

Pyro979 · Accepted Answer · 2012-10-07 15:45:14Z

Is there a reason you're not just setting the random index into a variable and just using that?

function setImage()
{
    var images = ['anemone.gif', 'ball.gif', 'crab.gif', 'fish2.gif', 'gull.gif',  'jellyfish.gif', 'moon.gif', 'sail.gif', 'shell.gif', 'snail.gif', 'sun.gif','sunnies.gif', 'whale.gif'];
    var slots = [document.getElementById('slot0'), document.getElementById('slot1'),     document.getElementById('slot2')];

    var rnd0 = Math.floor(Math.random() * images.length);
    var rnd1 = Math.floor(Math.random() * images.length);
    var rnd2 = Math.floor(Math.random() * images.length);

    document.getElementById('slot0').src = images[rnd0];
    document.getElementById('slot1').src = images[rnd1];
    document.getElementById('slot2').src = images[rnd2];
    alert(rnd2);
}

If there is you should try alerting the source of the image and make sure that it matches in format to the images array.

If you're still having trouble, set up a jsfiddle with both html and JS so we can see what's going on.

prashanth · Accepted Answer · 2012-10-07 16:07:38Z

1

document.getElementById('slot2') will gove you the node (img in this case). So you can't find this in the array containing src values.

document.getElementById('slot2').src will give you full path (like http://....../file.ext), not just file name.

Use attributes property.

document.getElementById('slot2').attributes["src"]

edited Oct 7, 2012 at 16:07

answered Oct 7, 2012 at 16:02

prashanth

2,10912 silver badges13 bronze badges

Comments

Cliff Ribaudo · Accepted Answer · 2012-10-07 14:03:35Z

0

Don't you mean:

alert(images.indexOf(document.getElementById('slot2').src));

edited Oct 7, 2012 at 14:03

answered Oct 7, 2012 at 12:18

Cliff Ribaudo

9,0592 gold badges60 silver badges81 bronze badges

4 Comments

Nathan Alexander Goodger Over a year ago

there are two other slots (slot0, slot1) which also require the same treatment, the alert code gives me -1 as the index of the element from the array in all three instances.

Cliff Ribaudo Over a year ago

You should probably post more code. What is in the array images? If there is NO image element in there with an ID attribute == 'slot0' your not going to find it :)

Cliff Ribaudo Over a year ago

Try alert(images.indexOf(document.getElementById('slot2').src));

Cliff Ribaudo Over a year ago

Well if you tried it earlier with the id set to 'slot0' it definitely fails :)

Collectives™ on Stack Overflow

Select a random element from array and check its index

3 Answers 3

Comments

Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related