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 相关文章推荐
jQuery学习笔记 操作jQuery对象 文档处理
Sep 19 Javascript
JS删除数组元素的函数介绍
Mar 27 Javascript
JqueryMobile动态生成listView并实现刷新的两种方法
Mar 05 Javascript
js定时器(执行一次、重复执行)
Mar 07 Javascript
jQuery中[attribute=value]选择器用法实例
Dec 31 Javascript
JS异步文件分片断点上传的实现思路
Dec 25 Javascript
Bootstrap 下拉多选框插件Bootstrap Multiselect
Jan 22 Javascript
JavaScript实现向select下拉框中添加和删除元素的方法
Mar 07 Javascript
详解webpack2+React 实例demo
Sep 11 Javascript
JavaScript数据结构之单链表和循环链表
Nov 28 Javascript
node的process以及child_process模块学习笔记
Mar 06 Javascript
记录vue项目中遇到的一点小问题
May 14 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中break及continue两个流程控制指令区别分析
2011/04/18 PHP
比较时间段一与时间段二是否有交集的php函数
2011/05/31 PHP
php 升级到 5.3+ 后出现的一些错误,如 ereg(); ereg_replace(); 函数报错
2015/12/07 PHP
TP5框架model常见操作示例小结【增删改查、聚合、时间戳、软删除等】
2020/04/05 PHP
再谈Yii Framework框架中的事件event原理与应用
2020/04/07 PHP
动态加载js的几种方法
2006/10/23 Javascript
JavaScript Event事件学习第一章 Event介绍
2010/02/07 Javascript
javascrpt绑定事件之匿名函数无法解除绑定问题
2012/12/06 Javascript
JS验证控制输入中英文字节长度(input、textarea等)具体实例
2013/06/21 Javascript
判断日期是否能跨月查询的js代码
2014/07/25 Javascript
JS延时器提示框的应用实例代码解析
2016/04/27 Javascript
jQuery zTree 异步加载添加子节点重复问题
2017/11/29 jQuery
解决node修改后需频繁手动重启的问题
2018/05/13 Javascript
微信小程序按钮点击动画效果的实现
2019/09/04 Javascript
vue登录注册实例详解
2019/09/14 Javascript
jstree中的checkbox默认选中和隐藏示例代码
2019/12/29 Javascript
[01:27]2014DOTA2展望TI 剑指西雅图IG战队专访
2014/06/30 DOTA
Python创建xml的方法
2015/03/10 Python
selenium+python截图不成功的解决方法
2019/01/30 Python
Python实现Linux监控的方法
2019/05/16 Python
Python queue队列原理与应用案例分析
2019/09/27 Python
如何获取Python简单for循环索引
2019/11/21 Python
django实现日志按日期分割
2020/05/21 Python
在tensorflow下利用plt画论文中loss,acc等曲线图实例
2020/06/15 Python
如何通过python实现IOU计算代码实例
2020/11/02 Python
Django搭建项目实战与避坑细节详解
2020/12/06 Python
精灵市场:Pixie Market
2019/06/18 全球购物
英国Iceland杂货店:网上食品购物
2020/12/16 全球购物
密封类可以有虚函数吗
2014/08/11 面试题
校园活动策划书范文
2014/01/10 职场文书
校园联欢晚会主持词
2014/03/17 职场文书
火灾现场处置方案
2014/05/28 职场文书
师范生求职自荐信
2014/06/14 职场文书
个人批评与自我批评范文
2014/10/17 职场文书
养成教育主题班会
2015/08/13 职场文书
解决flex布局中子项目尺寸不受flex-shrink限制
2022/05/11 HTML / CSS