JavaScript_7_练习:随机抽奖案例

效果图

代码

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>练习:随机抽奖案例</title><style>* {box-sizing: border-box;}div {margin: 100px auto;padding: 100px 270px;width: 800px;height: 400px;background: url(images/bg01.jpg) no-repeat left/contain;}</style>
</head><body><div><h1>一等奖:<Strong></Strong></h1><h2>二等奖:<strong></strong></h2><h3>三等奖:<strong></strong></h3></div><script>const arr = ['张三', '李四', '王五', '赵六', '冯七']for (let i = 0; i < 3; i++) {let num = Math.floor(Math.random() * arr.length)let stron = document.querySelectorAll("div strong")[i]stron.innerHTML = arr[num]arr.splice(num, 1)}</script>
</body></html>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/52011.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

vue项目配置基础路由vue-router

1、运行以下命令安装vue-router yarn add vue-router 2、在src目录下的components中新建两个vue页面 3、在src目录下新建router文件夹&#xff0c;在router文件夹下面新建index.js文件 4、配置main.js文件 //引入Vue import Vue from "vue"; //引入App import App…

全新分支版本!微软推出Windows 11 Canary Build 27686版

已经很久没有看到 Windows 11 全新的分支版本了&#xff0c;今天微软发布 Windows 11 Canary 新版本&#xff0c;此次版本号已经转移到 Build 27xxx&#xff0c;首发版本为 Build 27686 版。 此次更新带来了多项改进&#xff0c;包括 Windows Sandbox 沙盒功能切换到 Microsof…

LearnOpenGL——SSAO学习笔记

LearnOpenGL——SSAO学习笔记 SSAO一、基本概念二、样本缓冲三、法向半球四、随机核心转动五、SSAO着色器六、环境遮蔽模糊七、应用SSAO遮蔽因子 SSAO 一、基本概念 环境光照是我们加入场景总体光照中的一个固定光照常量&#xff0c;它被用来模拟光的散射(Scattering)。散射应…

QT事件机制理解

事件和信号 从硬件层来看: 事件就是一种中断&#xff0c; 中断的产生形式: 1.用户操控硬件所产生的中断。 2.由系统自身所产生的中断&#xff0c;比如说定时器。 这种中断由系统内核监控&#xff0c;由系统内核接收到中断并向CPU发出的执行请求就叫信号。所以说事件是信号产生…

C++,std::bind 详解

文章目录 1. 概述2. 基本用法2.1 使用占位符2.2 示例 3. 总结 1. 概述 std::bind 是 C11 引入的一个功能&#xff0c;它允许你将函数&#xff08;或成员函数、函数对象&#xff09;与其参数绑定&#xff0c;生成一个新的可调用对象。这个功能在需要将函数及其参数一起传递给其…

[OC]萝卜圈玩行车记录仪

图1-1&#xff0c;你的手动小车 代码是 #机器人驱动主程序 #请在main中编写您自己的机器人驱动代码 import tkinter as tk import turtle v0 # 速度 accFalse;slowFalse;leftFalse;rightFalse # 按键状态 step0.5 # 一次速度变化量 def keyup_press(event):global acc;accTru…

正点原子linux开发板 qt程序交叉编译执行

1.开发板光盘 A-基础资料->5、开发工具->1、交叉编译器->fsl-imx-x11-glibc-x86_64-meta-toolchain-qt5-cortexa7hf-neon-toolchain-4.1.15-2.1.0.sh 拷贝到 Ubuntu 虚拟机 用文件传输系统或者共享文件夹传输到linux虚拟机 用ls -l查看权限&#xff0c;如果是白色的使…

保姆级-C#与Halcon的窗体界面展示阈值分割图像教程(机器视觉保姆级教程)

经历上一篇《零基础小白实现C#调用halcon dll的过程&#xff0c;并测试程序证明C#halcon联合开发成功》的发布已经过去三天啦&#xff0c; 零基础小白实现C#调用halcon dll的过程&#xff0c;并测试程序证明C#halcon联合开发成功-CSDN博客 在友友的催更下&#xff0c;我将用我…

Android笔试面试题AI答之Kotlin(18)

文章目录 86. 阐述Kotlin中性能优化之局部函数 &#xff1f;局部函数的优点间接的性能优化注意事项 87. 简述Kotlin中性能优化之数组使用 &#xff1f;1. 选择合适的数组类型2. 避免不必要的数组创建3. 优化数组访问4. 合理使用数组遍历方式5. 利用Kotlin的集合操作API6. 注意数…

go 系列之 once

一、简介 once 方法用于保证指定函数只执行一次。例如配置懒加载&#xff0c;客户端获取密钥等场景&#xff0c;都可以用到once。 二、技术实现 2.1 Once.go type Once struct {done atomic.Uint32m Mutex }func (o *Once) Do(f func()) {if o.done.Load() 0 {o.doSlow(…

红黑树的特点和使用场景

红黑树&#xff08;Red-Black Tree&#xff09;是一种 自平衡二叉搜索树&#xff0c;它在插入、删除和查找操作时保持了树的平衡性&#xff0c;从而保证了这些操作的时间复杂度为 O(log n)。红黑树在实际应用中广泛使用&#xff0c;例如在操作系统的内核中用于管理进程调度、文…

rabbitmq镜像集群搭建

用到的ip地址 ip地址端口192.168.101.65&#xff08;主&#xff09;15672192.168.101.7515672192.168.101.8515672 安装erlang和rabbitmq 安装 安装三个包 yum install esl-erlang_23.0-1_centos_7_amd64.rpm -y yum install esl-erlang-compat-18.1-1.noarch.rpm -y rpm -…

探索CompletableFuture:高效异步编程的利器

目录 一、CompletableFuture基本功能安利 二、CompletableFuture使用介绍 &#xff08;一&#xff09;任务创建使用 1.supplyAsync创建带有返回值的异步任务 2.runAsync创建没有返回值的异步任务 &#xff08;二&#xff09;异步回调使用 1.异步回调&#xff1a;thenApp…

基于Sringboot+Vue个人驾校预约管理系统--论文pf

TOC springboot503基于SringbootVue个人驾校预约管理系统--论文pf 第1章 绪论 1.1选题动因 当前的网络技术&#xff0c;软件技术等都具备成熟的理论基础&#xff0c;市场上也出现各种技术开发的软件&#xff0c;这些软件都被用于各个领域&#xff0c;包括生活和工作的领域。…

XSS-games

XSS 1.XSS 漏洞简介2.XSS的原理3.XSS的攻击方式4.XSS-GAMESMa SpaghetJefffUgandan KnucklesRicardo MilosAh Thats HawtLigmaMafiaOk, BoomerWW3svg 1.XSS 漏洞简介 ​ XSS又叫CSS&#xff08;Cross Site Script&#xff09;跨站脚本攻击是指恶意攻击者往Web页面里插入恶意Sc…

Nginx服务器申请及配置免费SSL证书

免费SSL证书申请 背景&#xff1a; 我的情况是这样&#xff0c;域名解析是华为云的&#xff0c;然后免费证书在腾讯云申请。但是大致的配置流程都是一样的 在腾讯云平台申请免费的SSL证明(目前有效期是90天)&#xff0c;申请步骤如下 主要步骤说明 申请免费SSL证书根据申请时说…

对商品评论进行文本分析(NLP)的实战项目

文本分析技术是指使用计算机程序或算法处理、分析和理解文本数据的一系列方法。这种技术在自然语言处理&#xff08;NLP&#xff09;领域中非常重要&#xff0c;它可以应用于多种场景&#xff0c;包括但不限于情感分析、主题识别、信息提取、文本分类等。以下是一些常见的文本分…

使用Python+os模块创建文件和文件夹

一、使用Python的open函数创建文件 # 创建文件 with open(/home/Download/my_directory/my_file.txt, w) as f:f.write(世界你好)open(name[, mode[, buffering]])参数详解 name : 一个包含了你要访问的文件名称的字符串值。 mode : mode 决定了打开文件的模式&#xff1a;只…

GAP技术:实现隔离网络之间安全数据交换的创新方案

在当今高度互联的世界中&#xff0c;网络安全和数据隐私已经成为企业和组织最为关注的课题之一。特别是在一些高度敏感的环境中&#xff0c;如金融、国防、医疗等领域&#xff0c;网络隔离是防止数据泄露和网络攻击的关键手段。然而&#xff0c;如何在保持网络隔离的前提下&…

CryptoJS hex模式前端

CryptoJS 加密&#xff1a; aesJson (str, secretKey, aesIv, padding) {let keylet ivkey CryptoJS.enc.Utf8.parse(secretKey)iv CryptoJS.enc.Utf8.parse(aesIv)let plaintText str // CryptoJS.enc.Utf8.parse(str) 明文stringlet encrypted CryptoJS.AES.encrypt(pl…