话不多说，附上源码，仅供大家参考
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
[removed][removed]
[removed]
var numArray = new Array();
var personNum = 30;
$(function () {
for (var i = 0; i < personNum;
这是一个使用JavaScript实现的随机数字抽签实例，代码中利用了jQuery库进行DOM操作。下面将详细解释这个实例涉及的关键知识点。
1. **HTML结构**：
实例中的HTML部分创建了一个包含多个`<ul>`列表的布局，每个列表项`<li>`都可以被点击。在页面底部还有一个`<input>`按钮，用于启动抽签过程。这种布局设计便于用户交互，同时也为后续的JavaScript操作提供了元素集合。
2. **jQuery库**：
jQuery库（`jquery-1.10.2.js`）被引入，用于简化DOM操作。在JavaScript代码中，`$`符号是jQuery的别名，用于执行选择器、事件绑定等操作。
3. **JavaScript变量与数组**：
- `numArray` 是一个用来存储参与抽签编号的数组，初始值为空。
- `personNum` 定义了参与抽签的人数，本例中为30。
4. **DOM加载事件**：
使用`$(function () {...})`，这是jQuery的文档就绪（document ready）事件，确保当DOM完全加载后才执行内部的代码。
5. **循环填充数组**：
通过`for`循环，将0到`personNum-1`的整数填充到`numArray`中。这意味着数组包含了所有可能的抽签编号。
6. **事件监听**：
- 对每个`<li>`元素，添加了`click`事件监听器。当用户点击列表项时，会调用一个匿名函数，生成一个随机数并将其显示在该列表项上，同时从`numArray`中移除，防止重复抽取。
7. **随机数生成**：
使用`Math.random()`生成0到1之间（不包括1）的随机浮点数，然后通过`Math.floor()`向下取整，再乘以`numArray.length`得到0到数组长度之间的随机整数。`+ 1 - 1`是为了让随机数从1开始，而非从0开始，以匹配列表项的编号。
8. **抽签按钮事件**：
当用户点击`id`为`btnStart`的按钮时，触发抽签过程。将所有列表项的文本内容收集到`totalArray`数组中。然后，再次生成一个随机数，找到`totalArray`中的对应元素，将其设置为抽签结果，并改变对应列表项的背景色以突出显示。
9. **CSS样式**：
CSS部分定义了列表项`<li>`和抽签按钮`<input>`的样式，包括尺寸、边框、间距、对齐方式以及颜色等，以提供良好的视觉效果。
10. **DOM操作**：
使用`innerText`属性获取和设置文本内容，`style`属性更改元素样式，`splice()`方法从数组中删除元素，这些都是JavaScript对DOM进行操作的常见手法。
这个实例展示了如何结合HTML、CSS和JavaScript（以及jQuery）创建一个互动的抽签应用。它涵盖了DOM操作、事件处理、随机数生成以及数组操作等多个JavaScript核心概念。这个实例不仅有助于学习JavaScript基础，也适用于实际的网页开发项目中，例如在线投票、抽奖等活动。
