Home Java Javascript-array JavaScript array get elements at random
Questions:Ask|Latest

 
 

Share on Google+Share on Google+

JavaScript array get elements at random

Advertisement
In this example of getting JavaScript array elements randomly we have printed the array elements by the random index position of the array.

JavaScript array get elements at random

     

In this example of getting JavaScript array elements randomly we have printed the array elements by the random index position of the array. For generating random numbers we have used the Math.random() function.

In our HTML code we have created an array of ten elements and have stored ten elements in this array object arrName. Now in the variables  firstRandomNumber, secondRandomNumber and thirdRandomNumber we have generated three random numbers between value "0" and "9". Each and every time when the page is refreshed it changes the value of these three random variable and therefore we get the three different elements each time in the running page. Here is the full example code for printing the array elements by the random index position: 

 

 

 

javascript_array_random.html

<html>
  <head>
  <title> JavaScript array random </title>
  <script type="text/javascript">
  var arrName = new Array(10);
  arrName[0"Amit";
  arrName[1"Santosh";
  arrName[2"Rose";
  arrName[3"India";
  arrName[4"News";
  arrName[5"Track";
  arrName[6"Sandeep";
  arrName[7"Suman";
  arrName[8"Saurabh";
  arrName[9"Vineet";
  var firstRandomNumber = (Math.round((Math.random()*8)+1))
  document.write("<b>First element:=</b>"
  +arrName
[firstRandomNumber]+"</br>");
  var secondRandomNumber = (Math.round((Math.random()*8)+1))
  document.write("<b>Second element:=</b>"
  +arrName
[secondRandomNumber]+"</br>");
  var thirdRandomNumber = (Math.round((Math.random()*8)+1))
  document.write("<b>Third element:=</b>"
  +arrName
[thirdRandomNumber]+"</br>");
  </script>
  </head>
  <body bgcolor="#ffffdd">
  <form>
  <h2><font color="blue">JavaScript array Random Example</font></h2>
  <input type="submit" value="Refresh"/>
  </form>
  </body>
</html>

Output is as follows:

It shows three random elements from the array at three position in the HTML page.

If you click on the "Refresh" button it will print different array elements randomly.

Download Sample Source Code

Advertisements

If you enjoyed this post then why not add us on Google+? Add us to your Circles



Liked it!  Share this Tutorial


Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.

Posted on: November 10, 2008

Related Tutorials

Ask Questions?    Discuss: JavaScript array get elements at random   View All Comments

Post your Comment


Your Name (*) :
Your Email :
Subject (*):
Your Comment (*):
  Reload Image
 
 
Comments
Guest
June 12, 2011
Error

It will never pick item 0 of the array(Amit). Use var randomnumber=Math.floor(Math.random()*10) instead.
vengat
September 14, 2011
Dynamically change text background color

<html> <head> <title>Javascript Change CSS Class of Div tag</title> <style type="text/css"> .redText,.blueText { width: 200px; font-family: Arial; } .redText { color : green } .blueText { color : blue } </style> <script language="javascript" type="text/javascript"> function changeCssClass(objDivID) { var Random= (Math.round((Math.random()*100)+1)); var Random1= (Math.round((Math.random()*100)+1)); var Random2= (Math.round((Math.random()*100)+1)); var y=15; var x='#'+Random2+Random+Random1; document.getElementById(objDivID).style.background =x; } </script> </head> <body> <center> <div id="div1" class="redText"> By default text indside this HTML div tag is red. Javascript function will change the CSS class<br /> of this Div tag and <br /> text color will change to blue dynamically. </div> <br /> <input type="button" value="click here" onclick="changeCssClass('div1')" /> </center> </body> </html>
Student
April 12, 2012
WRONG

THAT SENTENCE IS WRONG. "It shows three random elements from the array at three position in the HTML page." Because you can get same elements from the array. There is a big chance to get same number from 0 - 9 .
Curtis
May 5, 2012
JavaScript array get elements at random

Hi, You have some useful information on your site. On your code above, I was wondering: var firstRandomNumber = (Math.round((Math.random()*8)+1)) Since 1 is always added to the Math.random()*8 return value, it doesn't seem that you would ever get 0. I used your code with a slight variation. I was thinking something like: var firstRandomNumber = (Math.round(Math.random()*(arrName.length - 1)) might get the full range of the array. Best, Curtis
DMCA.com