JavaScript——随机点名练习

最新推荐文章于 2024-06-30 21:59:36 发布

鹿蹊zz

最新推荐文章于 2024-06-30 21:59:36 发布

阅读量3.3k

点赞数 9

分类专栏： JavaScript 文章标签： javascript 前端随机点名

本文链接：https://blog.youkuaiyun.com/m0_46461853/article/details/125728990

版权

随机点名

要求：

当点击开始按钮时，名单会随机变换跳动显示，开始按钮变成了停止按钮；

当点击停止按钮时，名字的随机变换跳动停止，显示出的名字即为随机点击出来的姓名，达到随机点名效果。

思路：

1、使用 HTML+CSS 布局出随机点名系统的页面。

2、嵌入 JS 代码，定义要随机姓名数组变量，并初始化姓名信息。

3、为开始按钮添加点击事件，并编写定时器程序，随机显示姓名信息。

4、编写停止按钮事件处理程序，终止定时程序并显示随机出来的姓名信息，最后完成输出。

代码：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">

    <title>Document</title>
    <style type="text/css">
        /* 设置点名器位置居中 */
        .box {
            width: 200px;
            margin: auto;

最低0.47元/天解锁文章