JavaScript生成随机数字

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

<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>随机数</title>

<style>
* {
margin: 0;
}

.box {
position: relative;
width: 100%;
height: auto;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
background: #182F5D;
}

.box-item {
width: 700px;
height: 100px;
margin-bottom: 10px;
}

.title {
width: 100%;
height: 50px;
line-height: 50px;
font-size: 18px;
text-align: left;
color: greenyellow;
}

.content {
border: 1px #ccc solid;
width: 100%;
height: 50px;
line-height: 50px;
box-sizing: border-box;
color: #fff;
word-wrap: break-word;
}

.div7 {
height: 200px;
width: 900px;
}

.div7 .content {
height: 150px;
}

.check-box {
width: 100%;
height: 50px;
display: flex;
justify-content: space-between;
align-items: center;
}

.check-box .check-item {
width: 20%;
height: 50px;
float: left;
}

.check-box .check-item input {
width: 50px;
height: 20px;
}

.check-box .check-item option select {
width: 50px;
height: 20px;
}

.div7-content {
width: 100%;
height: 100px;
}
</style>

<body>
<div class="box">
<div class="box-item">
<div class="title">div1 要求（范围：0~100，个数：10，排序：不排序，重复：可重复）</div>
<div class="content" id="div1"></div>
</div>
<div class="box-item">
<div class="title">div2 要求（范围：1~100，个数：10，排序：不排序，重复：不重复）</div>
<div class="content" id="div2"></div>
</div>
<div class="box-item">
<div class="title">div3 要求（范围：1~100，个数：10，排序：升序，重复：可重复）</div>
<div class="content" id="div3"></div>
</div>
<div class="box-item">
<div class="title">div4 要求（范围：1~100，个数：10，排序：降序，重复：可重复）</div>
<div class="content" id="div4"></div>
</div>
<div class="box-item">
<div class="title">div5 要求（范围：168~200，个数：10，排序：升序，重复：不重复）</div>
<div class="content" id="div5"></div>
</div>
<div class="box-item">
<div class="title">div6 要求（范围：-168~200，个数：10，排序：升序，重复：不重复）</div>
<div class="content" id="div6"></div>
</div>
<div class="box-item div7">
<div class="title">div7 要求（自定义）</div>
<div class="content">
<div class="check-box">
<div class="check-item"> <label>最小值：</label><input type="text" id="minNumber"></div>
<div class="check-item"> <label>最大值：</label><input type="text" id="maxNumber"></div>
<div class="check-item"> <label>个数：</label><input type="text" id="math"></div>
<div class="check-item"> <label>排序：</label>
<select id="sort">
<option value="0">不排序</option>
<option value="1">升序</option>
<option value="2">降序</option>
</select>
</div>
<div class="check-item"> <label>重复：</label>
<select id="repeat">
<option value="0">可重复</option>
<option value="1">不重复</option>
</select>
</div>
<div class="check-item">
<button onclick="submit()">生成</button>
<button onclick="reset()">重置</button>
</div>
</div>
<div class="div7-content">
<textarea id="div7" style="width: 100%; height: 100px;border: 0;"></textarea>
</div>
</div>
</div>
</div>
<div id="sring"></div>
</body>
<script>
div1();
div2();
div3();
div4();
div5();
div6();

function div1() {
let arr = [];
for (i = 0; i < 10; i++) {
arr[i] = (Math.floor(Math.random() * 101))
}
document.querySelector("#div1").innerHTML = arr;
}

function div2() {
let arr = [];
for (i = 0; i < 10; i++) {
let num = Math.floor(Math.random() * 100) + 1;
if (arr.indexOf(num) === -1) { //判断数组newArr内有没有此元素
arr.push(num);
} else {
i--;
}
}
document.querySelector("#div2").innerHTML = arr;
}

function div3() {
let arr = [];
for (i = 0; i < 10; i++) {
arr[i] = (Math.floor(Math.random() * 100) + 1)
}
arr.sort(function (a, b) {
return a - b
}); //升序
document.querySelector("#div3").innerHTML = arr;
}

function div4() {
let arr = [];
for (i = 0; i < 10; i++) {
arr[i] = (Math.floor(Math.random() * 100) + 1)
}
arr.sort(function (a, b) {
return b - a
}); //降序
document.querySelector("#div4").innerHTML = arr;
}

function div5() {
let arr = [];
for (i = 0; i < 10; i++) {
let num = (Math.floor(Math.random() * 33) + 168)
if (arr.indexOf(num) === -1) { //判断数组newArr内有没有此元素
arr.push(num);
} else {
i--;
}
}
arr.sort(function (a, b) {
return a - b
}); //升序
document.querySelector("#div5").innerHTML = arr;
}

function div6() {
let arr = [];
for (i = 0; i < 10; i++) {
let num = (Math.floor(Math.random() * 369) + (-168))
if (arr.indexOf(num) === -1) { //判断数组newArr内有没有此元素
arr.push(num);
} else {
i--;
}
}
arr.sort(function (a, b) {
return a - b
}); //升序
document.querySelector("#div6").innerHTML = arr;
}

var minNumber, maxNumber, math, sort, repeat;

function submit() {
minNumber = parseInt(document.querySelector("#minNumber").value); //最小值
maxNumber = parseInt(document.querySelector("#maxNumber").value); //最大值
math = parseInt(document.querySelector("#math").value); //数量
sort = parseInt(document.querySelector("#sort").value); //排序
repeat = parseInt(document.querySelector("#repeat").value); //是否重复
let spacing = maxNumber - minNumber; //数差
console.log('最小值:' + minNumber, '最大值:' + maxNumber, '数量:' + math, '排序:' + sort, '重复;' + repeat, '数差:' +
spacing);
if (repeat === 0) {
if (checkNum(minNumber) && checkNum(maxNumber) && math > 0) {
let arr = [];
if (repeat === 0) {
for (i = 0; i < math; i++) {
let num = (Math.floor(Math.random() * (maxNumber - minNumber + 1)) + minNumber);
arr.push(num);
}
} else if (repeat === 1) {
for (i = 0; i < math; i++) {
let num = (Math.floor(Math.random() * (maxNumber - minNumber + 1)) + minNumber);
if (arr.indexOf(num) === -1) { //判断数组newArr内有没有此元素
arr.push(num);
} else {
i--;
}
}
}
if (sort === 1) {
arr.sort(function (a, b) {
return a - b
});
} else if (sort === 2) {
arr.sort(function (a, b) {
return b - a
});
} else if (sort === 0) {
arr = arr;
}
document.querySelector("#div7").innerHTML = arr;
} else {
}
} else if (repeat === 1) {
if (checkNum(minNumber) && checkNum(maxNumber) && math > 0 && spacing >= (math - 1)) {
let arr = [];
if (repeat === 0) {
for (i = 0; i < math; i++) {
let num = (Math.floor(Math.random() * (maxNumber - minNumber + 1)) + minNumber);
arr.push(num);
}
} else if (repeat === 1) {
for (i = 0; i < math; i++) {
let num = (Math.floor(Math.random() * (maxNumber - minNumber + 1)) + minNumber);
if (arr.indexOf(num) === -1) { //判断数组newArr内有没有此元素
arr.push(num);
} else {
i--;
}
}
}
if (sort === 1) {
arr.sort(function (a, b) {
return a - b
});
} else if (sort === 2) {
arr.sort(function (a, b) {
return b - a
});
} else if (sort === 0) {
arr = arr;
}
document.querySelector("#div7").innerHTML = arr;
} else {
}
}
}

function reset() {
document.querySelector("#minNumber").value = '';
document.querySelector("#maxNumber").value = '';
document.querySelector("#math").value = '';
document.querySelector("#sort").value = 0;
document.querySelector("#repeat").value = 0;
}

function checkNum(input) {
let reg = /^-?\d+\$/; //判断字符串是否为整数
let num = input;
return reg.test(num);
}
</script>

</html>


09-13
02-18 8692
02-05
11-30
09-05 1万+