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之大字符串的连接的StringBuffer 类
May 08 Javascript
JavaScript 事件查询综合
Jul 13 Javascript
Javascript 复制数组实现代码
Nov 26 Javascript
『jQuery』取指定url格式及分割函数应用
Apr 22 Javascript
判断及设置浏览器全屏模式
Apr 20 Javascript
动态创建script在IE中缓存js文件时导致编码的解决方法
May 04 Javascript
Node.js中安全调用系统命令的方法(避免注入安全漏洞)
Dec 05 Javascript
20分钟轻松创建自己的Bootstrap站点
May 12 Javascript
jQuery在header中设置请求信息的方法
Mar 06 Javascript
原生javascript实现分页效果
Apr 21 Javascript
jquery.guide.js新版上线操作向导镂空提示jQuery插件(推荐)
May 20 jQuery
JavaScript对象原型链原理解析
Jan 22 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实现的MySQL通用查询程序
2007/03/11 PHP
深入理解php的MySQL连接类
2013/06/07 PHP
php foreach正序倒序输出示例代码
2014/07/01 PHP
php不使用copy()函数复制文件的方法
2015/03/13 PHP
PHP封装的Twitter访问类实例
2015/07/18 PHP
PHP实现基于栈的后缀表达式求值功能
2017/11/10 PHP
Laravel中9个不经常用的小技巧汇总
2019/04/16 PHP
JS+XML 省份和城市之间的联动实现代码
2009/10/14 Javascript
checkbox使用示例
2013/08/23 Javascript
jQuery动态显示和隐藏datagrid中的某一列的方法
2013/12/11 Javascript
Jquery给基本控件的取值、赋值示例
2014/05/23 Javascript
JavaScript中获取样式的原生方法小结
2014/10/08 Javascript
javascript Deferred和递归次数限制实例
2014/10/21 Javascript
jQuery的load()方法及其回调函数用法实例
2015/03/25 Javascript
javascript的理解及经典案例分析
2016/05/20 Javascript
第八篇Bootstrap下拉菜单实例代码
2016/06/21 Javascript
vue遍历对象中的数组取值示例
2019/11/07 Javascript
jQuery实现评论模块
2020/08/19 jQuery
python查看FTP是否能连接成功的方法
2015/07/30 Python
python编写暴力破解zip文档程序的实例讲解
2018/04/24 Python
详谈python在windows中的文件路径问题
2018/04/28 Python
python opencv实现旋转矩形框裁减功能
2018/07/25 Python
Python封装原理与实现方法详解
2018/08/28 Python
Python中的heapq模块源码详析
2019/01/08 Python
对django中foreignkey的简单使用详解
2019/07/28 Python
Python下载网易云歌单歌曲的示例代码
2020/08/12 Python
Python图像读写方法对比
2020/11/16 Python
css 省略号 css3让多余的字符串消失并附加省略号的实现代码
2013/02/07 HTML / CSS
详解Html5中video标签那些属性和方法
2019/07/01 HTML / CSS
解决html5中video标签无法播放mp4问题的办法
2017/05/07 HTML / CSS
法国和欧洲海边和滑雪度假:Pierre & Vacances
2017/01/04 全球购物
产品发布会策划方案
2014/05/12 职场文书
《观察物体》教学反思
2016/02/17 职场文书
创业计划书之游泳馆
2019/09/16 职场文书
浅谈CSS不规则边框的生成方案
2021/05/25 HTML / CSS
SpringMVC 整合SSM框架详解
2021/08/30 Java/Android