php随机点名,记录:随机点名案列 - 专用pink的切图仔的个人空间 - OSCHINA - 中文开源技术交流社区...

本文介绍如何使用JavaScript实现王者荣耀随机点名功能,包括创建英雄列表、动态生成随机点名、定时切换背景色及点击事件控制。通过代码展示了如何利用Date对象获取当前时间并设置定时任务来实现角色点名效果。
摘要由CSDN通过智能技术生成
王侯将相宁有种乎

ul,li{

list-style: none;

}

/*清除浮动*/

.clearfix:after{

content: "";

line-height: 0;

height: 0;

display: block;

visibility: hidden;

clear: both;

}

*{

padding: 0;

margin: 0;

}

body{

background-color: #ffc0cb;

position: relative;

}

h1{margin-top: 50px;

text-align: center;

}

/*盒子的选择器*/

ul{

width: 1000px;

margin: 50px auto;

}

/*按钮的选择器*/

input{

width: 100px;

height: 30px;

position: absolute;

left: 50%;

margin-left:-50px;

}

/*随机内容的选择器*/

.names{

float: left;

width: 100px;

height: 30px;

line-height: 30px;

margin: 10px 0 0 10px;

text-align: center;

background-color: #faebd7;

}

span {

display: block;

height: 30px;

width: 200px;

position: absolute;

right: 100px;

}

//便捷获取id

function my$(id) {

return document.getElementById(id);

}

/**

* 获取制定格式的时间

* @param dt 日期的对象

* @returns {string} 返回的是字符串的日期时间

*/

function getDate(dt){

// 获取年

var year=dt.getFullYear();

//获取月

var month=dt.getMonth();

// 获取日

var day=dt.getDate();

// 获取小时

var hours=dt.getHours();

// 获取分钟

var minutes=dt.getMinutes();

// 获取秒

var second=dt.getSeconds();

month=month<10?"0"+month:month;

hours=hours<10?'0'+hours:hours;

minutes=minutes<10?'0'+minutes:minutes;

second=second<10?'0'+second:second;

return year+'年'+month+'月'+day+"日"+" "+hours+':'+minutes+":"+second;

}

王者荣耀随机点名

//获取时间

var shiJian=new Date();

my$("time").innerText=getDate(shiJian);

//建立王者荣耀英雄数组

var arrs = ["鲁班七号","诸葛亮","后裔","赵云","女娲","小乔","不知火舞","大乔",

"韩信","亚瑟","孙尚香","孙悟空","孙膑","马可波罗","廉颇","扁鹊","白起","安琪拉"

,"刘禅","张飞","妲己","甄姬","虞姬","项羽","庄周","黄忠","芈月","钟馗"

,"刘邦","狄仁杰","王昭君","蔡文姬","花木兰","兰陵王","哪吒","姜子牙","武则天","关羽"

,"周瑜","曹操","李白","阿珂","吕布","嬴政","刘备"];

// 2、为div盒子添加内容

for(var i=0;i

var liObj=document.createElement("li");

liObj.innerText=arrs[i];

liObj.className="names";

my$("dv").appendChild(liObj);

}

// 3.设置定时器函数

function setTimes() {

// 循环遍历数组,清空每一位的背景色

for(var j=0;j

my$("dv").children[j].style.backgroundColor="";

}

//给选中的

var random=parseInt(Math.random()*arrs.length);

my$("dv").children[random].style.backgroundColor="red";

}

// 4 设置点击事件

my$("btn").οnclick=function () {

if(this.value=="开始"){

times=setInterval(setTimes,10);

this.value="停止";

}else if(this.value=="停止"){

clearInterval(times);

this.value="开始"

}

}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值