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 相关文章推荐
在html页面中包含共享页面的方法
Oct 24 Javascript
javascript中substr,substring,slice.splice的区别说明
Nov 25 Javascript
用js获取电脑信息(是使用与IE浏览器)
Jan 15 Javascript
JS复制到剪贴板示例代码
Oct 30 Javascript
javascript中局部变量和全局变量的区别详解
Feb 27 Javascript
javascript实现十秒钟后注册按钮可点击的方法
May 13 Javascript
jQuery EasyUI学习教程之datagrid点击列表头排序
Jul 09 Javascript
jQuery实现的导航下拉菜单效果示例
Sep 05 Javascript
Vue.js每天必学之Class与样式绑定
Sep 05 Javascript
完美解决mui框架off-canvas侧滑超出部分隐藏无法滚动的问题
Jan 25 Javascript
Vue.set()动态的新增与修改数据,触发视图更新的方法
Sep 15 Javascript
微信小程序上传图片到php服务器的方法
May 23 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树的代码,可以嵌套任意层
2006/10/09 PHP
用php+javascript实现二级级联菜单的制作
2008/05/06 PHP
php配合jquery实现增删操作具体实例
2013/12/12 PHP
php结合js实现点击超链接执行删除确认操作
2014/10/31 PHP
php提高脚本性能的4个技巧
2020/08/18 PHP
php的单例模式及应用场景详解
2021/02/27 PHP
js 在定义的时候立即执行的函数表达式(function)写法
2013/01/16 Javascript
浅谈js和css内联外联注意事项
2016/06/30 Javascript
JS闭包可被利用的常见场景小结
2017/04/09 Javascript
对angular 监控数据模型变化的事件方法$watch详解
2018/10/09 Javascript
Javascript读取上传文件内容/类型/字节数
2019/04/30 Javascript
微信小程序开发之左右分栏效果的实例代码
2019/05/20 Javascript
使用layui监听器监听select下拉框,事件绑定不成功的解决方法
2019/09/28 Javascript
JavaScrip如果基于url实现图片下载
2020/07/03 Javascript
基于JavaScript实现随机点名器
2021/02/25 Javascript
python实现多线程的方式及多条命令并发执行
2016/06/07 Python
Python写的一个定时重跑获取数据库数据
2016/12/28 Python
用Python分析3天破10亿的《我不是药神》到底神在哪?
2018/07/12 Python
对Python3 解析html的几种操作方式小结
2019/02/16 Python
Python利用scapy实现ARP欺骗的方法
2019/07/23 Python
Python自动化导出zabbix数据并发邮件脚本
2019/08/16 Python
详解opencv中画圆circle函数和椭圆ellipse函数
2019/12/27 Python
深入浅析Python 函数注解与匿名函数
2020/02/24 Python
keras中的loss、optimizer、metrics用法
2020/06/15 Python
美国女孩洋娃娃店:American Girl
2017/10/24 全球购物
Amara德国:家居饰品、设计师品牌和豪华礼品
2019/05/20 全球购物
Ticketmaster意大利:音乐会、节日、艺术和剧院的官方门票
2019/12/23 全球购物
旅游与酒店管理的自我评价分享
2013/11/03 职场文书
个人德育工作总结
2015/03/05 职场文书
2015年工商所工作总结
2015/05/21 职场文书
2016年中学植树节活动总结
2016/03/16 职场文书
MySQL非空约束(not null)案例讲解
2021/08/23 MySQL
Python实现打乒乓小游戏
2021/09/25 Python
Nginx配置https的实现
2021/11/27 Servers
搭建Yolov5服务器
2022/04/30 Servers
Redis特殊数据类型HyperLogLog基数统计算法讲解
2022/06/01 Redis