javascript实现数组中的内容随机输出


Posted in Javascript onAugust 11, 2015

有时候我们可能需要从数组中随机抽出一项内容,下面就通过一段代码实例介绍一下如何实现此效果。

代码如下:

<script type="text/JavaScript"> 
var theArray=new Array();
theArray[0]="三水点靠木";
theArray[1]="三水点靠木一";
theArray[2]="三水点靠木二";
theArray[3]="三水点靠木三";
theArray[4]="三水点靠木四";
theArray[5]="三水点靠木五";
theArray[6]="三水点靠木六";
function ranFun()
{
 return parseInt(Math.random()*7);
}
document.write(theArray[ranFun()]);
</script>

以上代码可以随机输出数组中的元素,代码非常的简单,通过使用随机数函数为数组提供一个随机的索引即可。

从数组随机读取N条不同数据

方法一

var ary = new Array();
var xiaowu=new Array(
“1我的
“,
“2我的
“,
“3我的
“,
“4我的
“,
“5我的
“,
“6我的
“,
“7我的
“,
“8我的
“,
“9我的
“,
“10我的
“,
“11我的
“,
“12我的
“,
“13我的
“,
“14我的
“,
“15我的
“,
“16我的
“,
“17我的
“,
“18我的
“,
“19我的
“,
“20我的
”
);
var s01=xiaowu.length
while(ary.length < 6)
{
var tmp =xiaowu[parseInt(Math.random()*s01)]
var b = false;
for (var i=0; i<ary.length; i++)
{
if (ary[i] == tmp)
{
b = true;
break;
}
}
if (!b)
ary[ary.length] = tmp;
}
document.write(ary[0]);
document.write(ary[1]);
document.write(ary[2]);
document.write(ary[3]);
document.write(ary[4]);
document.write(ary[5]);

方法二

//从一个给定的数组arr中,随机返回num个不重复项
function getArrayItems(arr, num) {
//新建一个数组,将传入的数组复制过来,用于运算,而不要直接操作传入的数组;
var temp_array = new Array();
for (var index in arr) {
temp_array.push(arr[index]);
}
//取出的数值项,保存在此数组
var return_array = new Array();
for (var i = 0; i<num; i++) {
//判断如果数组还有可以取出的元素,以防下标越界
if (temp_array.length>0) {
//在数组中产生一个随机索引
var arrIndex = Math.floor(Math.random()*temp_array.length);
//将此随机索引的对应的数组元素值复制出来
return_array[i] = temp_array[arrIndex];
//然后删掉此索引的数组元素,这时候temp_array变为新的数组
temp_array.splice(arrIndex, 1);
} else {
//数组中数据项取完后,退出循环,比如数组本来只有10项,但要求取出20项.
break;
}
}
return return_array;
}

//测试
var ArrList=[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33];
alert(getArrayItems(ArrList,6));

这段JS代码可以对数组内的元素进行随机排列,这个非常有用,比如我们在玩扑克牌的时候可以让扑克牌进行排列,也就是电脑洗牌。

Javascript 相关文章推荐
JavaScript 给汉字排序实例代码
Jun 28 Javascript
jquery中输入验证中一个不错的效果
Aug 21 Javascript
JS判断不同分辨率调用不同的CSS样式文件实现思路及测试代码
Jan 23 Javascript
浅谈js 闭包引起的内存泄露问题
Jun 22 Javascript
jquery中checkbox使用方法简单实例演示
Nov 24 Javascript
jQuery组件easyui基本布局实现代码
Aug 25 Javascript
JS实现页面跳转参数不丢失的方法
Nov 28 Javascript
Bootstrap 模态框(Modal)插件代码解析
Dec 21 Javascript
xmlplus组件设计系列之按钮(2)
Apr 26 Javascript
AngularJs定时器$interval 和 $timeout详解
May 25 Javascript
详解从Vue.js源码看异步更新DOM策略及nextTick
Oct 11 Javascript
写一个移动端惯性滑动&amp;回弹Vue导航栏组件 ly-tab
Mar 06 Javascript
javascript弹出拖动窗口
Aug 11 #Javascript
jquery.fastLiveFilter.js实现输入自动过滤的方法
Aug 11 #Javascript
javascript实现五星评价代码(源码下载)
Aug 11 #Javascript
jQuery的remove()方法使用详解
Aug 11 #Javascript
jquery实现点击展开列表同时隐藏其他列表
Aug 10 #Javascript
jquery实现Li滚动时滚动条自动添加样式的方法
Aug 10 #Javascript
jQuery右下角旋转环状菜单特效代码
Aug 10 #Javascript
You might like
PHP parse_url 一个好用的函数
2009/10/03 PHP
php xml 入门学习资料
2011/01/01 PHP
浅谈本地WAMP环境的搭建
2015/05/13 PHP
php通过PHPExcel导入Excel表格到MySQL数据库的简单实例
2016/10/29 PHP
javascript 遍历验证所有文本框的值
2009/08/27 Javascript
jQuery实现公告文字左右滚动的实例代码
2013/10/29 Javascript
javascript操纵OGNL标签示例代码
2014/06/16 Javascript
对 jQuery 中 data 方法的误解分析
2014/06/18 Javascript
JavaScript 浏览器对象模型BOM使用介绍
2015/04/13 Javascript
Jquery基础之事件操作详解
2016/06/14 Javascript
Bootstrap导航条可点击和鼠标悬停显示下拉菜单
2016/11/25 Javascript
JavaScript结合HTML DOM实现联动菜单
2017/04/05 Javascript
解析Vue 2.5的Diff算法
2017/11/28 Javascript
详解使用webpack构建多页面应用
2017/12/21 Javascript
用 Vue.js 递归组件实现可折叠的树形菜单(demo)
2017/12/25 Javascript
vue 基于element-ui 分页组件封装的实例代码
2018/12/10 Javascript
浅谈webpack 四个核心概念之Entry
2019/06/12 Javascript
微信自定义分享链接信息(标题,图片和内容)实现过程详解
2019/09/04 Javascript
vue项目使用$router.go(-1)返回时刷新原来的界面操作
2020/07/26 Javascript
Python生成器(Generator)详解
2015/04/13 Python
python编程开发之日期操作实例分析
2015/11/13 Python
python UNIX_TIMESTAMP时间处理方法分析
2016/04/18 Python
Python读取一个目录下所有目录和文件的方法
2016/07/15 Python
Python编程argparse入门浅析
2018/02/07 Python
python装饰器简介---这一篇也许就够了(推荐)
2019/04/01 Python
python调用webservice接口的实现
2019/07/12 Python
Python实现捕获异常发生的文件和具体行数
2020/04/25 Python
html5关于外链嵌入页面通信问题(postMessage解决跨域通信)
2020/07/20 HTML / CSS
荷兰的时尚市场:To Be Dressed
2019/05/06 全球购物
德国领先的大尺码和超大尺码男装在线零售商:Bigtex
2019/06/22 全球购物
初中生学习的自我评价
2013/11/14 职场文书
五四青年节演讲稿
2014/05/26 职场文书
保护环境的标语
2014/06/09 职场文书
2014年大学生党员评议表自我评价
2014/09/20 职场文书
2016七一建党节慰问信
2015/11/30 职场文书
python批量更改目录名/文件名的方法
2021/04/18 Python