js实现随机点名小功能


Posted in Javascript onAugust 17, 2017

本文实例为大家分享了js实现随机点名功能的具体代码,供大家参考,具体内容如下

<!DOCTYPE html> 
<html> 
 <head> 
  <meta charset="UTF-8"> 
  <title></title> 
 </head> 
 <body> 
  <div id="name1"></div> 
  <button id="btn">stop</button> 
   
 </body> 
 <script type="text/javascript"> 
  var flag = true; 
  var str = "张三,李四,王五,马六"; 
  var arr = str.split(","); 
  var interId = setInterval("randName()",100); 
  function randName(){ 
   var rand = Math.floor(Math.random() * arr.length); 
   name1.innerHTML = arr[rand]; 
  }  
  btn.onclick = function (){ 
   if (flag) { 
    btn.innerHTML = "start"; 
    clearInterval(interId); 
    flag = false; 
   } else{ 
     
 
btn.innerHTML = "stop"; 
    interId = setInterval("randName()",100); 
    flag = true; 
   } 
  } 
 </script> 
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js解析与序列化json数据(三)json的解析探讨
Feb 01 Javascript
使用jquery实现div的tab切换实例代码
May 27 Javascript
对JavaScript中this指针的新理解分享
Jan 31 Javascript
JavaScript function函数种类详解
Feb 22 Javascript
javascript数组遍历的方法实例分析
Sep 13 Javascript
React Native 集成jpush-react-native的示例代码
Aug 16 Javascript
Three.js利用顶点绘制立方体的方法详解
Sep 27 Javascript
vue监听对象及对象属性问题
Aug 20 Javascript
浅谈js中的bind
Mar 18 Javascript
jQuery zTree插件使用简单教程
Aug 16 jQuery
小程序跨页面交互的作用与方法详解
Jan 07 Javascript
Vue中使用JsonView来展示Json树的实例代码
Nov 16 Javascript
浅谈Vuejs Prop基本用法
Aug 17 #Javascript
简单快速的实现js计算器功能
Aug 17 #Javascript
使用jquery的jsonp如何发起跨域请求及其原理详解
Aug 17 #jQuery
如何理解Vue的.sync修饰符的使用
Aug 17 #Javascript
浅谈JS中的反柯里化( uncurrying)
Aug 17 #Javascript
js编写简单的聊天室功能
Aug 17 #Javascript
Angular使用 ng-img-max 调整浏览器中的图片的示例代码
Aug 17 #Javascript
You might like
Php做的端口嗅探器--可以指定网站和端口
2006/10/09 PHP
Apache, PHP在Windows 9x/NT下的安装与配置 (一)
2006/10/09 PHP
浅析PHP程序防止ddos,dns,集群服务器攻击的解决办法
2013/06/18 PHP
php网页版聊天软件实现代码
2016/08/12 PHP
PHP标准库 (SPL)――Countable用法示例
2020/06/05 PHP
Tinymce+jQuery.Validation使用产生的BUG
2010/03/29 Javascript
深入理解JavaScript系列(4) 立即调用的函数表达式
2012/01/15 Javascript
JavaScript高级程序设计阅读笔记(六) ECMAScript中的运算符(二)
2012/02/27 Javascript
JAVASCRIPT模式窗口中下载文件无法接收iframe的流
2013/10/11 Javascript
node.js插件nodeclipse安装图文教程
2020/10/19 Javascript
javascript三种代码注释方法
2016/06/02 Javascript
JS触摸与手势事件详解
2017/05/09 Javascript
AngularJS 购物车全选/取消全选功能的实现方法
2017/08/14 Javascript
BootStrap TreeView使用实例详解
2017/11/01 Javascript
vue translate peoject实现在线翻译功能【新手必看】
2018/06/07 Javascript
使用angular-cli webpack创建多个包的方法
2018/10/16 Javascript
js中Array对象的常用遍历方法详解
2019/01/17 Javascript
nodejs实现用户登录路由功能
2019/05/22 NodeJs
基于javascript原生判断DOM是否加载完毕
2020/10/14 Javascript
springboot+vue+对接支付宝接口+二维码扫描支付功能(沙箱环境)
2020/10/15 Javascript
arcgis.js控制地图地体的显示范围超出区域自动弹回(实现思路)
2021/01/28 Javascript
python的即时标记项目练习笔记
2014/09/18 Python
Python实现对一个函数应用多个装饰器的方法示例
2018/02/09 Python
TensorFlow实现简单卷积神经网络
2018/05/24 Python
Python操作列表常用方法实例小结【创建、遍历、统计、切片等】
2019/10/25 Python
python与mysql数据库交互的实现
2020/01/06 Python
Python函数参数分类原理详解
2020/05/28 Python
美国医生配方营养补充剂供应商:Healthy Directions
2019/07/10 全球购物
写clone()方法时,通常都有一行代码,是什么?
2012/10/31 面试题
十岁生日家长答谢词
2014/01/17 职场文书
北京奥运会口号
2014/06/21 职场文书
开展党的群众路线教育实践活动领导班子对照检查材料
2014/09/25 职场文书
2015大学自主招生自荐信范文
2015/03/04 职场文书
幼儿园教师师德承诺书
2015/04/28 职场文书
2015年项目经理工作总结
2015/04/30 职场文书
2015中学教师个人工作总结
2015/07/22 职场文书