一区二区三区在线-一区二区三区亚洲视频-一区二区三区亚洲-一区二区三区午夜-一区二区三区四区在线视频-一区二区三区四区在线免费观看

服務器之家:專注于服務器技術及軟件下載分享
分類導航

node.js|vue.js|jquery|angularjs|React|json|js教程|

服務器之家 - 編程語言 - JavaScript - js教程 - JS實現隨機點名系統

JS實現隨機點名系統

2022-02-22 16:15乘風破浪的程序媛 js教程

這篇文章主要為大家詳細介紹了JS實現隨機點名系統,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下

用JS實現一個隨機點名系統,供大家參考,具體內容如下

每次上課前10分鐘,老師都會叫我們回答問題,奈何每次都是點學號,好像每次我都能中獎,我直接跟老師提議,老師,我用來JS來幫你寫個隨機點名的系統吧!這樣就不會每次都抽到我了,哈哈

先看效果:

JS實現隨機點名系統

代碼如下:

?
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
34
35
36
37
38
39
40
41
42
<!DOCTYPE html>
<html lang="en">
 
<head>
 <meta charset="UTF-8">
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>Document</title>
</head>
 
<body>
 <button id="box1">開始</button>
 <button id="box2">結束</button>
 <span id="box">Tom</span>
 
 <script>
  //獲取頁面中的元素
 
  var btn1 = document.getElementById('box1');
  var btn2 = document.getElementById('box2');
  var span = document.getElementById('box');
  var names = ['Tom', 'Jack', 'Lucy', 'Peter', 'Mark', 'Min', 'Liu', 'Rani'];
  var timer;
 
  btn1.onclick = function() {
   window.clearInterval(timer);
 
   timer = window.setInterval(countName, 100);
  };
 
  btn2.onclick = function() {
   window.clearInterval(timer);
  };
 
  function countName() {
   var index = parseInt(Math.random() * names.length);
   span.innerHTML = names[index];
  }
 </script>
</body>
 
</html>

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持服務器之家。

原文鏈接:https://blog.csdn.net/m0_46374969/article/details/115343312

延伸 · 閱讀

精彩推薦
  • js教程JavaScript點擊按鈕生成4位隨機驗證碼

    JavaScript點擊按鈕生成4位隨機驗證碼

    這篇文章主要為大家詳細介紹了JavaScript點擊按鈕生成4位隨機驗證碼,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一...

    搬磚大法4512022-01-10
  • js教程原生js實現自定義難度的掃雷游戲

    原生js實現自定義難度的掃雷游戲

    這篇文章主要為大家詳細介紹了原生js實現自定義難度的掃雷游戲,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下...

    清歡灬6512022-01-06
  • js教程微信小程序彈窗禁止頁面滾動的實現代碼

    微信小程序彈窗禁止頁面滾動的實現代碼

    這篇文章主要介紹了微信小程序彈窗禁止頁面滾動的實現代碼,本文通過實例代碼給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需...

    任我行RQ5602021-12-23
  • js教程微信小程序實現購物車小功能

    微信小程序實現購物車小功能

    這篇文章主要為大家詳細介紹了微信小程序實現購物車小功能,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下...

    小王同學Max5522021-12-22
  • js教程js實現星星閃特效

    js實現星星閃特效

    這篇文章主要為大家詳細介紹了js實現星星閃特效,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下...

    過客塵煙11442022-02-12
  • js教程JS實現百度搜索框

    JS實現百度搜索框

    這篇文章主要為大家詳細介紹了JS實現百度搜索框,實時返回搜索建議項,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參...

    張先生的blog9302022-01-24
  • js教程微信小程序組件生命周期的踩坑記錄

    微信小程序組件生命周期的踩坑記錄

    這篇文章主要給大家介紹了關于微信小程序組件生命周期的踩坑記錄,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值...

    不曾11592022-01-25
  • js教程js實現簡單的倒計時

    js實現簡單的倒計時

    這篇文章主要為大家詳細介紹了js實現簡單的倒計時,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下...

    搬磚大法8272022-01-10
主站蜘蛛池模板: t66y地址一地址二地址三 | 西西人体大胆啪啪私拍色约约 | 精品视频 久久久 | 欧美精品国产一区二区三区 | 国产成人综合网亚洲欧美在线 | 欧美一区二区三区gg高清影视 | 91禁漫| 无人在线观看免费高清视频播放 | 白丝美女用胸伺候主人 | 亚洲AV 无码AV 中文字幕 | 草莓在线 | 范冰冰a级一级特级毛片 | 无码区国产区在线播放 | 91久久综合九色综合欧美98 | 国产自在线拍 | 国产精品视频免费看 | 成人性生交小说免费看 | 国产99在线a视频 | 热99这里有精品综合久久 | 亚洲精品一区波多野结衣 | 天天久久综合 | 岛国a香蕉片不卡在线观看 荡女淫春2古装 | 午夜私人影院在线观看 | 色综合天天综合网看在线影院 | 性福演算法 | 高清黄色直接看 | 亚洲男人天堂久久 | 国产一区二区在线看 | 国产精品久久毛片蜜月 | 欧美草逼网站 | 欧美乱码视频 | 欧美精品久久久久久久影视 | avove全部视频在线观看 | 99爱在线| 99热影院| 日本免费一区二区三区a区 日本免费三片在线观看 | 青草青草视频2免费观看 | 精品久久久久久国产 | 久久99国产亚洲高清观着 | 亚州在线 | 十六以下岁女子毛片免费 |